:root {
  --fenisa-red: #c71920;
  --fenisa-red-dark: #99151b;
  --fenisa-red-action: #e5444a;
  --fenisa-red-action-hover: #ef4444;
  --fenisa-red-soft: #fce9e9;
  --fenisa-ink: #202023;
  --fenisa-text: #34343a;
  --fenisa-muted: #71717a;
  --fenisa-border: #e3e5e9;
  --fenisa-surface: #ffffff;
  --fenisa-canvas: #f4f5f7;
  --fenisa-radius: 8px;
  --fenisa-shadow: 0 8px 24px rgba(32, 32, 35, 0.07);
}

html.fenisa-brand,
html.fenisa-brand body {
  min-height: 100%;
}

html.fenisa-brand {
  height: 100%;
}

html.fenisa-brand body,
html.fenisa-brand button,
html.fenisa-brand input,
html.fenisa-brand select,
html.fenisa-brand textarea {
  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

html.fenisa-brand body {
  background-color: var(--fenisa-canvas);
  color: var(--fenisa-text);
  -webkit-font-smoothing: antialiased;
}

html.fenisa-brand a {
  color: var(--fenisa-red-dark);
}

html.fenisa-brand a:hover,
html.fenisa-brand a:focus {
  color: var(--fenisa-red);
}

html.fenisa-brand h1,
html.fenisa-brand h2,
html.fenisa-brand h3,
html.fenisa-brand h4,
html.fenisa-brand h5 {
  color: var(--fenisa-ink);
  font-weight: 600;
  letter-spacing: -0.015em;
}

html.fenisa-brand .left-bar,
html.fenisa-brand .side-bar {
  background: var(--fenisa-ink);
  box-shadow: 3px 0 18px rgba(22, 17, 18, 0.1);
}

html.fenisa-brand .left-bar .admin-logo,
html.fenisa-brand .side-bar .admin-logo {
  min-height: 94px;
  background: var(--fenisa-ink);
  border-bottom: 3px solid var(--fenisa-red);
}

html.fenisa-brand .left-bar .admin-logo .logo-holder,
html.fenisa-brand .side-bar .admin-logo .logo-holder {
  padding: 6px 0;
}

html.fenisa-brand .left-bar .admin-logo .logo-holder .logo,
html.fenisa-brand .side-bar .admin-logo .logo-holder .logo {
  width: 80px;
  height: 80px;
  object-fit: contain;
  border-radius: 5px;
}

html.fenisa-brand .left-bar .menu-parent,
html.fenisa-brand .side-bar .menu-parent {
  padding-top: 100px;
}

html.fenisa-brand .left-bar .menu-parent > li,
html.fenisa-brand .side-bar .menu-parent > li {
  border-bottom-color: rgba(255, 255, 255, 0.07);
}

html.fenisa-brand .left-bar .menu-parent > li > a,
html.fenisa-brand .side-bar .menu-parent > li > a {
  color: #e7e5e5;
  font-weight: 500;
  transition: background-color 0.18s ease, color 0.18s ease;
}

html.fenisa-brand .left-bar .menu-parent > li > a i,
html.fenisa-brand .side-bar .menu-parent > li > a i {
  color: #e5a1a3;
}

html.fenisa-brand .left-bar .menu-parent > li.active,
html.fenisa-brand .left-bar .menu-parent > li:hover,
html.fenisa-brand .side-bar .menu-parent > li.active,
html.fenisa-brand .side-bar .menu-parent > li:hover {
  background: #332326;
}

html.fenisa-brand .left-bar .menu-parent > li.active,
html.fenisa-brand .side-bar .menu-parent > li.active {
  border-left: 3px solid var(--fenisa-red);
}

html.fenisa-brand #mainMenu li ul {
  background: #292528;
}

html.fenisa-brand .left-bar .menu-parent > li.active > a,
html.fenisa-brand .left-bar .menu-parent > li:hover > a,
html.fenisa-brand .side-bar .menu-parent > li.active > a,
html.fenisa-brand .side-bar .menu-parent > li:hover > a {
  color: #ffffff;
}

html.fenisa-brand .left-bar .menu-parent > li.active > a i,
html.fenisa-brand .left-bar .menu-parent > li:hover > a i,
html.fenisa-brand .side-bar .menu-parent > li.active > a i,
html.fenisa-brand .side-bar .menu-parent > li:hover > a i {
  color: #ffb3b6;
}

html.fenisa-brand .left-bar .menu-parent > li ul > li a,
html.fenisa-brand .side-bar .menu-parent > li ul > li a {
  color: #d6d2d3;
}

html.fenisa-brand .wrapper.mini-bar .left-bar .admin-logo .logo-holder .logo {
  width: 48px;
  height: 48px;
}

html.fenisa-brand .wrapper.mini-bar .left-bar .admin-logo {
  min-height: 62px;
}

html.fenisa-brand .wrapper.mini-bar .left-bar .admin-logo .logo-holder {
  padding: 6px 0;
}

html.fenisa-brand .wrapper.mini-bar .left-bar .menu-parent {
  padding-top: 68px;
}

@media only screen and (min-width: 802px) {
  html.fenisa-brand .left-bar .admin-logo a.menu-bar {
    align-items: center;
    background: var(--fenisa-red-dark);
    border-radius: 6px;
    color: #ffffff;
    display: flex;
    font-size: 15px;
    height: 34px;
    justify-content: center;
    padding: 0;
    right: 8px;
    top: 30px;
    width: 34px;
  }

  html.fenisa-brand .left-bar .admin-logo a.menu-bar:hover,
  html.fenisa-brand .left-bar .admin-logo a.menu-bar:focus {
    background: var(--fenisa-red);
    color: #ffffff;
  }

  html.fenisa-brand .wrapper.mini-bar .left-bar {
    width: 90px;
  }

  html.fenisa-brand .wrapper.mini-bar .content {
    margin-left: 90px;
  }

  html.fenisa-brand .wrapper.mini-bar .left-bar .admin-logo .logo-holder .logo {
    height: 38px;
    width: 38px;
  }

  html.fenisa-brand .wrapper.mini-bar .left-bar .admin-logo a.menu-bar {
    height: 28px;
    right: 4px;
    top: 17px;
    width: 28px;
  }
}

@media only screen and (max-width: 801px) {
  html.fenisa-brand .left-bar .admin-logo a.menu-bar {
    display: none;
  }
}

html.fenisa-brand .top-bar,
html.fenisa-brand .top-bar nav.navbar,
html.fenisa-brand .top-bar .navbar-default {
  background: var(--fenisa-ink) !important;
  border: 0 !important;
  border-bottom: 3px solid var(--fenisa-red) !important;
  color: #ffffff;
}

html.fenisa-brand .top-bar .navbar-nav,
html.fenisa-brand .top-bar .navbar-default .navbar-nav > li,
html.fenisa-brand .top-bar .navbar-default .navbar-nav > li > a,
html.fenisa-brand .top-bar .navbar-default .navbar-nav > .open > a,
html.fenisa-brand .top-bar .navbar-default .navbar-nav > .open > a:focus,
html.fenisa-brand .top-bar .navbar-default .navbar-nav > .open > a:hover,
html.fenisa-brand .top-bar .nav > li > a,
html.fenisa-brand .top-bar .menu-bar-mobile {
  background: transparent !important;
  color: #ffffff !important;
}

html.fenisa-brand .top-bar .navbar-default .navbar-nav > li > a:hover,
html.fenisa-brand .top-bar .navbar-default .navbar-nav > li > a:focus {
  color: #ffb3b6 !important;
}

html.fenisa-brand .top-bar .navbar-breadcrumb,
html.fenisa-brand .top-bar .navbar-breadcrumb a,
html.fenisa-brand .top-bar .navbar-breadcrumb span {
  color: #ffffff !important;
}

html.fenisa-brand .top-bar .avatar-holder {
  display: inline-flex;
  width: 46px;
  height: 46px;
  margin-right: 8px;
  vertical-align: middle;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 2px solid #ffffff;
  border-radius: 9px;
  background: #ffffff;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.35);
}

html.fenisa-brand .top-bar .avatar_width .avatar-holder img {
  display: block;
  width: 100%;
  height: 100%;
  padding: 2px;
  border: 0;
  border-radius: 6px;
  background: #ffffff;
  object-fit: contain;
}

html.fenisa-brand .top-bar .avatar_info {
  color: #ffffff;
  font-weight: 600;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu {
  background: #ffffff !important;
  border: 1px solid var(--fenisa-border) !important;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu a {
  color: var(--fenisa-text) !important;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu a:hover {
  background: var(--fenisa-red-soft) !important;
  color: var(--fenisa-red-dark) !important;
}

html.fenisa-brand .btn-primary,
html.fenisa-brand .btn-primary:focus,
html.fenisa-brand .btn-primary:active,
html.fenisa-brand .btn-primary.active,
html.fenisa-brand .btn-primary[disabled],
html.fenisa-brand .btn-primary.disabled {
  color: #111111;
  background-color: var(--fenisa-red-action);
  background-image: none;
  border-color: var(--fenisa-red-action);
  text-shadow: none;
  box-shadow: none;
}

html.fenisa-brand .btn-primary:hover,
html.fenisa-brand .btn-primary:active:hover,
html.fenisa-brand .btn-primary.active:hover {
  color: #111111;
  background-color: var(--fenisa-red-action-hover);
  border-color: var(--fenisa-red-action-hover);
}

html.fenisa-brand .btn-danger {
  color: #111111;
  background-color: var(--fenisa-red-action);
  background-image: none;
  border-color: var(--fenisa-red-action);
  text-shadow: none;
}

html.fenisa-brand .btn-danger:hover,
html.fenisa-brand .btn-danger:focus,
html.fenisa-brand .btn-danger:active {
  color: #111111;
  background-color: var(--fenisa-red-action-hover);
  border-color: var(--fenisa-red-action-hover);
}

html.fenisa-brand .btn-default {
  background-image: none;
  border-color: var(--fenisa-border);
  color: var(--fenisa-text);
}

html.fenisa-brand .btn-default:hover,
html.fenisa-brand .btn-default:focus {
  background-color: #f6f6f7;
  border-color: #c9cbd1;
}

html.fenisa-brand .form-control,
html.fenisa-brand .select2-container .select2-choice,
html.fenisa-brand .select2-container-multi .select2-choices {
  border-color: #d8dbe1;
  border-radius: 6px !important;
  color: var(--fenisa-text);
}

html.fenisa-brand .form-control:focus,
html.fenisa-brand .select2-container-active .select2-choice,
html.fenisa-brand .select2-container-active .select2-choices {
  border-color: var(--fenisa-red);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(199, 25, 32, 0.12) !important;
}

html.fenisa-brand .panel,
html.fenisa-brand .panel-piluku,
html.fenisa-brand .modal-content,
html.fenisa-brand .dropdown-menu {
  border-color: var(--fenisa-border);
  border-radius: var(--fenisa-radius);
}

html.fenisa-brand .panel,
html.fenisa-brand .panel-piluku {
  box-shadow: var(--fenisa-shadow) !important;
}

html.fenisa-brand .panel-piluku > .panel-heading,
html.fenisa-brand .manage-table .panel-heading {
  background: #fffafa;
  border-bottom-color: #f0d9da;
  border-radius: var(--fenisa-radius) var(--fenisa-radius) 0 0;
}

html.fenisa-brand .panel-piluku > .panel-heading h3,
html.fenisa-brand .panel-piluku.panel-primary > .panel-heading h3 {
  color: var(--fenisa-ink) !important;
  font-weight: 600;
}

html.fenisa-brand .panel-piluku.panel-primary > .panel-heading {
  color: var(--fenisa-red);
  border-top: 2px solid var(--fenisa-red);
}

html.fenisa-brand .table > thead > tr > th,
html.fenisa-brand .table thead th {
  background-color: #f8f2f2;
  border-bottom-color: #e7d4d5;
  color: #393236;
  font-weight: 600;
}

html.fenisa-brand .table > tbody > tr:hover,
html.fenisa-brand .table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #fffafa;
}

html.fenisa-brand .pagination > .active > a,
html.fenisa-brand .pagination > .active > span,
html.fenisa-brand .pagination > .active > a:hover,
html.fenisa-brand .pagination > .active > span:hover {
  background-color: var(--fenisa-red-action);
  border-color: var(--fenisa-red-action);
  color: #111111;
}

html.fenisa-brand .label-primary,
html.fenisa-brand .label-danger,
html.fenisa-brand .badge {
  background-color: var(--fenisa-red-action);
  color: #111111;
}

html.fenisa-brand .info-number.count {
  background-color: var(--fenisa-red-action);
  color: #111111;
}

html.fenisa-brand .progress-bar,
html.fenisa-brand .progress-bar-primary,
html.fenisa-brand .progress-bar-danger {
  background-color: var(--fenisa-red-action);
  color: #111111;
  text-shadow: none;
}

html.fenisa-brand .nav-tabs > li.active > a,
html.fenisa-brand .nav-tabs > li.active > a:hover,
html.fenisa-brand .nav-tabs > li.active > a:focus {
  border-top-color: var(--fenisa-red);
  color: var(--fenisa-red-dark);
}

html.fenisa-brand .progress-bar,
html.fenisa-brand .progress-bar-primary,
html.fenisa-brand .progress-bar-danger {
  background-color: var(--fenisa-red-action);
}

html.fenisa-brand .dashboard-stats {
  min-height: 96px;
  margin-bottom: 16px;
  padding-left: 20px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(32, 32, 35, 0.06);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

html.fenisa-brand .dashboard-stats:hover {
  border-color: #e5b4b6;
  box-shadow: 0 9px 22px rgba(32, 32, 35, 0.1);
  transform: translateY(-2px);
}

html.fenisa-brand .dashboard-stats .left {
  position: relative;
  z-index: 1;
  max-width: 68%;
}

html.fenisa-brand .dashboard-stats .left h3,
html.fenisa-brand .dashboard-stats .left h3.flatBluec,
html.fenisa-brand .dashboard-stats .left h3.flatGreenc,
html.fenisa-brand .dashboard-stats .left h3.flatRedc,
html.fenisa-brand .dashboard-stats .left h3.flatOrangec {
  margin-top: 9px;
  margin-bottom: 4px;
  color: var(--fenisa-red-dark) !important;
  font-size: 27px;
  font-weight: 700;
}

html.fenisa-brand .dashboard-stats .left h4 {
  margin-top: 0;
  color: var(--fenisa-muted);
  font-size: 13px;
  font-weight: 500;
}

html.fenisa-brand .dashboard-stats .right,
html.fenisa-brand .dashboard-stats .right.flatBlue,
html.fenisa-brand .dashboard-stats .right.flatGreen,
html.fenisa-brand .dashboard-stats .right.flatRed,
html.fenisa-brand .dashboard-stats .right.flatOrange {
  right: 8px;
  top: 8px;
  bottom: 8px;
  width: 31%;
  border-radius: 8px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
}

html.fenisa-brand .dashboard-stats .right i {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
  line-height: normal;
}

html.fenisa-brand .dashboard-stats .right img {
  display: block;
  width: 46px;
  height: 46px;
  object-fit: contain;
}

html.fenisa-brand .dashboard-stats .right .dashboard-kpi-image {
  max-width: 46px;
  max-height: 46px;
}

html.fenisa-brand .quick-actions .list-group {
  height: auto;
  margin-bottom: 12px;
}

html.fenisa-brand .quick-actions .list-group-item {
  display: flex;
  min-height: 72px;
  align-items: center;
  gap: 14px;
  padding: 10px 16px 10px 12px;
  border: 1px solid var(--fenisa-border);
  border-radius: 9px;
  background: #ffffff;
  box-shadow: 0 3px 10px rgba(32, 32, 35, 0.04);
  color: var(--fenisa-text);
  font-size: 13px;
  font-weight: 500;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

html.fenisa-brand .quick-actions .quick-action-label {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.3;
}

html.fenisa-brand .quick-actions .list-group-item .quick-action-icon {
  display: flex;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid #f0d7d9;
  border-radius: 12px;
  background: linear-gradient(145deg, #fff4f4, #f8e4e6);
}

html.fenisa-brand .quick-actions .list-group-item .quick-action-icon img {
  display: block;
  width: 32px;
  height: 32px;
  object-fit: contain;
}

html.fenisa-brand .quick-actions .list-group-item:hover,
html.fenisa-brand .quick-actions .list-group-item:focus {
  transform: translateY(-1px);
  border-color: #e5b4b6;
  background: #fffafa;
  color: var(--fenisa-red-dark);
}

html.fenisa-brand .quick-actions .list-group-item:hover .quick-action-icon,
html.fenisa-brand .quick-actions .list-group-item:focus .quick-action-icon {
  border-color: #e6b9bc;
  background: #ffffff;
}

html.fenisa-brand .nav-tabs.piluku-tabs > li.active > a,
html.fenisa-brand .nav-tabs.piluku-tabs > li.active > a:hover,
html.fenisa-brand .nav-tabs.piluku-tabs > li.active > a:focus {
  border-top: 2px solid var(--fenisa-red);
  background: #fffafa;
  color: var(--fenisa-red-dark);
}

html.fenisa-brand .chart .ct-series-a .ct-line,
html.fenisa-brand .chart .ct-series-a .ct-point,
html.fenisa-brand .chart .ct-series-a .ct-bar {
  stroke: var(--fenisa-red);
}

html.fenisa-brand .chart .ct-series-a .ct-area,
html.fenisa-brand .chart .ct-series-a .ct-slice-pie {
  fill: var(--fenisa-red);
}

html.fenisa-brand .flip-container {
  max-width: calc(100% - 32px);
}

html.fenisa-brand .flip-container .front {
  box-sizing: border-box;
  width: 100%;
}

html.fenisa-brand .payroll-collaborator-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 22px 24px;
  background: linear-gradient(120deg, #fffafa, #ffffff);
  border-bottom: 1px solid var(--fenisa-border);
}

html.fenisa-brand .payroll-collaborator-heading h4,
html.fenisa-brand .payroll-form-intro h2 {
  margin: 0 0 5px;
  color: var(--fenisa-ink);
}

html.fenisa-brand .payroll-overtime-measurement-note {
  margin: 0 0 15px;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-overtime-measurement-note i {
  margin-right: 4px;
  color: var(--fenisa-red-dark);
}

html.fenisa-brand .payroll-collaborator-heading p,
html.fenisa-brand .payroll-form-intro p,
html.fenisa-brand .payroll-form-panel .panel-heading p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-collaborator-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

html.fenisa-brand .payroll-collaborator-table td {
  vertical-align: middle;
}

html.fenisa-brand .payroll-collaborator-table td small {
  display: block;
  margin-top: 3px;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-status-pill {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}

html.fenisa-brand .payroll-status-pill.is-active {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-status-pill.is-inactive {
  background: #f1f1f2;
  color: #62626a;
}

html.fenisa-brand .payroll-collaborator-empty {
  max-width: 540px;
  margin: 20px auto;
  padding: 36px 20px;
  text-align: center;
}

html.fenisa-brand .payroll-empty-icon,
html.fenisa-brand .payroll-form-intro-icon {
  display: flex;
  width: 54px;
  height: 54px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 25px;
}

html.fenisa-brand .payroll-collaborator-empty .payroll-empty-icon {
  margin: 0 auto 14px;
}

html.fenisa-brand .payroll-collaborator-empty p {
  margin-bottom: 20px;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-form-intro {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 8px 0 22px;
}

html.fenisa-brand .payroll-form-intro h2 {
  font-size: 24px;
}

html.fenisa-brand .payroll-form-panel {
  margin-bottom: 18px;
  overflow: hidden;
}

html.fenisa-brand .payroll-form-panel > .panel-heading {
  padding: 18px 22px;
  background: #fffafa;
  border-bottom: 1px solid #f0d9da;
}

html.fenisa-brand .payroll-form-panel > .panel-heading h3 {
  margin: 0 0 5px;
  font-size: 17px;
}

html.fenisa-brand .payroll-form-panel > .panel-heading h3 i {
  margin-right: 5px;
  color: var(--fenisa-red);
}

html.fenisa-brand .payroll-form-panel > .panel-body {
  padding: 22px;
}

html.fenisa-brand .payroll-form-panel .form-group {
  margin-bottom: 18px;
}

html.fenisa-brand .payroll-form-panel label {
  display: block;
  margin-bottom: 6px;
  color: var(--fenisa-ink);
  font-weight: 600;
}

html.fenisa-brand .payroll-form-panel label .required {
  color: var(--fenisa-red);
}

html.fenisa-brand .payroll-form-panel .help-block {
  margin-bottom: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-linked-account {
  margin-bottom: 18px;
  padding: 12px 14px;
  border: 1px solid var(--fenisa-border);
  border-radius: 7px;
  background: #fafafa;
}

html.fenisa-brand .payroll-emergency-contact .form-control + .form-control {
  margin-top: 8px;
}

html.fenisa-brand .payroll-active-field {
  padding-top: 28px;
}

html.fenisa-brand .payroll-active-field .checkbox-inline {
  display: inline-block;
}

html.fenisa-brand .payroll-form-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 0 0 28px;
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-collaborator-heading {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px;
  }

  html.fenisa-brand .payroll-collaborator-actions {
    width: 100%;
  }

  html.fenisa-brand .payroll-form-panel > .panel-body {
    padding: 16px;
  }
}

html.fenisa-brand .payroll-deductions-page {
  max-width: 1500px;
  margin: 0 auto;
  page: payroll;
}

html.fenisa-brand .payroll-person-deduction-report {
  max-width: 1100px;
  margin: 0 auto;
  page: payroll;
}

html.fenisa-brand .payroll-person-deduction-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 12px 0;
}

html.fenisa-brand .payroll-person-deduction-paper {
  padding: 28px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 8px 28px rgba(32, 32, 35, 0.07);
}

html.fenisa-brand .payroll-person-deduction-identity {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0;
}

html.fenisa-brand .payroll-person-deduction-identity > div,
html.fenisa-brand .payroll-person-deduction-totals > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
  padding: 11px 13px;
  border: 1px solid var(--fenisa-border);
  border-radius: 7px;
  background: #fafbfc;
}

html.fenisa-brand .payroll-person-deduction-identity span,
html.fenisa-brand .payroll-person-deduction-totals span {
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .payroll-person-deduction-identity strong {
  color: var(--fenisa-ink);
  overflow-wrap: anywhere;
}

html.fenisa-brand .payroll-person-deduction-totals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: 9px;
  margin-bottom: 22px;
}

html.fenisa-brand .payroll-person-deduction-totals strong {
  color: var(--fenisa-ink);
  font-size: 15px;
}

html.fenisa-brand .payroll-person-deduction-totals .is-total {
  border-color: #e4c9ca;
  background: #fff7f7;
}

html.fenisa-brand .payroll-person-deduction-totals .is-net {
  border-color: #c6dfce;
  background: #f2faf4;
}

html.fenisa-brand .payroll-person-deduction-detail > h3 {
  margin: 0 0 12px;
  color: var(--fenisa-ink);
  font-size: 17px;
}

html.fenisa-brand .payroll-person-deduction-period {
  margin-bottom: 16px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  overflow: hidden;
}

html.fenisa-brand .payroll-person-deduction-period > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 13px;
  border-bottom: 1px solid var(--fenisa-border);
  background: #f7f8fa;
  color: var(--fenisa-ink);
}

html.fenisa-brand .payroll-person-deduction-period > header span {
  display: block;
  margin-top: 3px;
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .payroll-person-deduction-table {
  margin: 0;
}

html.fenisa-brand .payroll-person-deduction-table th,
html.fenisa-brand .payroll-person-deduction-table td {
  padding: 8px 12px !important;
  color: var(--fenisa-ink);
}

html.fenisa-brand .payroll-person-deduction-table tfoot th {
  border-top: 2px solid var(--fenisa-border);
  background: #fafbfc;
}

html.fenisa-brand .payroll-person-deduction-empty,
html.fenisa-brand .payroll-person-deduction-note {
  padding: 12px;
  border-radius: 7px;
  background: #f6f8fa;
  color: var(--fenisa-muted);
  line-height: 1.5;
}

html.fenisa-brand .payroll-person-deduction-note {
  margin: 14px 0 0;
  font-size: 11px;
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-person-deduction-paper {
    padding: 15px;
  }

  html.fenisa-brand .payroll-person-deduction-identity {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

html.fenisa-brand .payroll-deductions-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 8px 0 18px;
}

html.fenisa-brand .payroll-deductions-header .payroll-document-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

html.fenisa-brand .payroll-deductions-header h2 {
  margin: 0 0 5px;
  font-size: 25px;
}

html.fenisa-brand .payroll-deductions-header p,
html.fenisa-brand .payroll-deduction-panel-heading p,
html.fenisa-brand .payroll-deduction-history-heading p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-deductions-header-icon {
  display: flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 26px;
}

html.fenisa-brand .payroll-deductions-notice {
  margin-bottom: 16px;
  padding: 11px 14px;
  border: 1px solid #eadfbf;
  border-radius: 7px;
  background: #fffaf0;
  color: #6e5a2b;
  font-size: 12px;
  line-height: 1.5;
}

html.fenisa-brand .payroll-deductions-notice i {
  margin-right: 5px;
}

html.fenisa-brand .payroll-deductions-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

html.fenisa-brand .payroll-deduction-summary-card {
  display: flex;
  min-height: 84px;
  align-items: center;
  gap: 12px;
  padding: 15px;
  border: 1px solid var(--fenisa-border);
  border-radius: 9px;
  background: #ffffff;
  box-shadow: 0 3px 12px rgba(32, 32, 35, 0.04);
}

html.fenisa-brand .payroll-deduction-summary-card .summary-icon {
  display: flex;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 21px;
}

html.fenisa-brand .payroll-deduction-summary-card .summary-icon.voluntary {
  background: #fff3d9;
  color: #8a5a00;
}

html.fenisa-brand .payroll-deduction-summary-card .summary-icon.balance {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-deduction-summary-card > div:last-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

html.fenisa-brand .payroll-deduction-summary-card strong {
  color: var(--fenisa-ink);
  font-size: 20px;
  line-height: 1.3;
}

html.fenisa-brand .payroll-deduction-summary-card span {
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-deduction-entry-row {
  display: flex;
  flex-wrap: wrap;
}

html.fenisa-brand .payroll-deduction-entry-row > [class*="col-"] {
  display: flex;
  flex-direction: column;
}

html.fenisa-brand .payroll-deduction-panel {
  flex: 1 1 auto;
  overflow: hidden;
}

html.fenisa-brand .payroll-deduction-panel-heading,
html.fenisa-brand .payroll-deduction-history-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 17px 20px;
  background: #fffafa;
  border-bottom: 1px solid var(--fenisa-border);
}

html.fenisa-brand .payroll-deduction-panel-heading h3,
html.fenisa-brand .payroll-deduction-history-heading h3 {
  margin: 0 0 4px;
  font-size: 16px;
}

html.fenisa-brand .payroll-deduction-panel-heading p {
  font-size: 12px;
  line-height: 1.4;
}

html.fenisa-brand .payroll-deduction-panel .panel-body {
  padding: 18px 20px;
}

html.fenisa-brand .payroll-deduction-form .form-group {
  margin-bottom: 14px;
}

html.fenisa-brand .payroll-deduction-form label,
html.fenisa-brand .payroll-deduction-filters label {
  display: block;
  margin-bottom: 5px;
  color: var(--fenisa-ink);
  font-weight: 600;
}

html.fenisa-brand .payroll-deduction-form label .required {
  color: var(--fenisa-red);
}

html.fenisa-brand .payroll-deduction-panel-heading .panel-heading-icon {
  display: flex;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 20px;
}

html.fenisa-brand .payroll-deduction-panel-heading .panel-heading-icon.credit {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-deduction-history {
  margin-bottom: 18px;
  overflow: hidden;
}

html.fenisa-brand .payroll-deduction-history-heading > div {
  flex: 1 1 auto;
}

html.fenisa-brand .payroll-deduction-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  background: #fafafa;
}

html.fenisa-brand .payroll-deduction-filters .form-group {
  min-width: 200px;
  margin: 0;
}

html.fenisa-brand .payroll-deduction-table td {
  vertical-align: middle;
}

html.fenisa-brand .payroll-deduction-table td small {
  display: block;
  margin-top: 3px;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-deduction-detail {
  display: block;
  margin-top: 3px;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-deduction-kind,
html.fenisa-brand .payroll-deduction-status {
  display: inline-block;
  padding: 4px 9px;
  border-radius: 18px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

html.fenisa-brand .payroll-deduction-kind.kind-voluntary {
  background: #fff3d9;
  color: #8a5a00;
}

html.fenisa-brand .payroll-deduction-status.is-open {
  background: #fff3d9;
  color: #8a5a00;
}

html.fenisa-brand .payroll-deduction-status.is-paid {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-deduction-empty {
  padding: 26px 16px;
  text-align: center;
}

html.fenisa-brand .payroll-deduction-empty > i {
  color: var(--fenisa-red-dark);
  font-size: 30px;
}

html.fenisa-brand .payroll-deduction-empty h4 {
  margin: 8px 0 4px;
}

html.fenisa-brand .payroll-deduction-empty p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-report-note {
  margin-bottom: 14px;
  padding: 10px 12px;
  border: 1px solid #d6e3ef;
  border-radius: 7px;
  background: #f3f8fc;
  color: #34536d;
  font-size: 12px;
  line-height: 1.5;
}

html.fenisa-brand .payroll-report-note i {
  margin-right: 5px;
}

html.fenisa-brand .payroll-deduction-report-summary {
  margin-bottom: 14px;
}

html.fenisa-brand .payroll-deduction-report table tfoot th {
  border-top: 2px solid var(--fenisa-border);
  background: #f4f7fa;
  color: var(--fenisa-ink);
}

@media (max-width: 991px) {
  html.fenisa-brand .payroll-deduction-entry-row > [class*="col-"] {
    width: 100%;
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-deductions-header {
    align-items: flex-start;
  }

  html.fenisa-brand .payroll-deductions-header .payroll-document-actions {
    flex-direction: column;
  }

  html.fenisa-brand .payroll-deductions-summary {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .payroll-deduction-panel-heading,
  html.fenisa-brand .payroll-deduction-history-heading {
    align-items: flex-start;
    padding: 15px;
  }

  html.fenisa-brand .payroll-deduction-filters .form-group {
    width: 100%;
    min-width: 0;
  }
}

html.fenisa-brand .payroll-overtime-page {
  max-width: 1500px;
  margin: 0 auto;
}

html.fenisa-brand .payroll-overtime-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 8px 0 20px;
}

html.fenisa-brand .payroll-overtime-header h2 {
  margin: 0 0 5px;
  font-size: 25px;
}

html.fenisa-brand .payroll-overtime-header p,
html.fenisa-brand .payroll-overtime-panel-heading p,
html.fenisa-brand .payroll-overtime-history-heading p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-overtime-legal-note {
  margin-bottom: 16px;
  padding: 11px 14px;
  border: 1px solid #eadfbf;
  border-radius: 7px;
  background: #fffaf0;
  color: #6e5a2b;
  font-size: 12px;
  line-height: 1.5;
}

html.fenisa-brand .payroll-overtime-legal-note i {
  margin-right: 5px;
  color: #9b7625;
}

html.fenisa-brand .payroll-overtime-header-icon,
html.fenisa-brand .payroll-overtime-heading-icon {
  display: flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 27px;
}

html.fenisa-brand .payroll-overtime-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

html.fenisa-brand .payroll-overtime-summary-card {
  display: flex;
  min-height: 88px;
  align-items: center;
  gap: 13px;
  padding: 16px;
  border: 1px solid var(--fenisa-border);
  border-radius: 9px;
  background: #ffffff;
  box-shadow: 0 3px 12px rgba(32, 32, 35, 0.04);
}

html.fenisa-brand .payroll-overtime-summary-card .summary-icon {
  display: flex;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #fff3d9;
  color: #8a5a00;
  font-size: 22px;
}

html.fenisa-brand .payroll-overtime-summary-card .summary-icon.approved {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-overtime-summary-card .summary-icon.tracked {
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
}

html.fenisa-brand .payroll-overtime-summary-card > div:last-child {
  display: flex;
  flex-direction: column;
}

html.fenisa-brand .payroll-overtime-summary-card strong {
  color: var(--fenisa-ink);
  font-size: 22px;
  line-height: 1.2;
}

html.fenisa-brand .payroll-overtime-summary-card span {
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-overtime-request-panel,
html.fenisa-brand .payroll-overtime-history {
  overflow: hidden;
}

html.fenisa-brand .payroll-overtime-panel-heading,
html.fenisa-brand .payroll-overtime-history-heading {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 18px 22px;
  background: #fffafa;
  border-bottom: 1px solid var(--fenisa-border);
}

html.fenisa-brand .payroll-overtime-heading-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 11px;
  font-size: 20px;
}

html.fenisa-brand .payroll-overtime-panel-heading h3,
html.fenisa-brand .payroll-overtime-history-heading h3 {
  margin: 0 0 4px;
  font-size: 17px;
}

html.fenisa-brand .payroll-overtime-history-heading > div {
  flex: 1 1 auto;
}

html.fenisa-brand .payroll-overtime-requester {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 18px;
  padding: 11px 13px;
  border: 1px solid var(--fenisa-border);
  border-radius: 7px;
  background: #fafafa;
}

html.fenisa-brand .payroll-overtime-requester i {
  color: var(--fenisa-red-dark);
  font-size: 18px;
}

html.fenisa-brand .payroll-overtime-requester span {
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-overtime-form {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) minmax(180px, 0.65fr) minmax(220px, 1fr) auto;
  align-items: end;
  gap: 14px;
}

html.fenisa-brand .payroll-overtime-form .form-group {
  margin: 0;
}

html.fenisa-brand .payroll-overtime-form label {
  display: block;
  margin-bottom: 6px;
  color: var(--fenisa-ink);
  font-weight: 600;
}

html.fenisa-brand .payroll-overtime-form label .required {
  color: var(--fenisa-red);
}

html.fenisa-brand .payroll-overtime-form .help-block {
  min-height: 17px;
  margin: 5px 0 0;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-overtime-submit .btn {
  min-height: 40px;
  white-space: nowrap;
}

html.fenisa-brand .payroll-overtime-empty-eligibility,
html.fenisa-brand .payroll-overtime-empty {
  padding: 24px 16px;
  text-align: center;
}

html.fenisa-brand .payroll-overtime-empty-eligibility > i {
  display: block;
  margin-bottom: 8px;
  color: #26723e;
  font-size: 32px;
}

html.fenisa-brand .payroll-overtime-empty-eligibility strong {
  color: var(--fenisa-ink);
}

html.fenisa-brand .payroll-overtime-empty-eligibility p,
html.fenisa-brand .payroll-overtime-empty p {
  margin: 6px 0 14px;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-overtime-pending-badge {
  padding: 5px 10px;
  border-radius: 18px;
  background: #fff3d9;
  color: #8a5a00;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

html.fenisa-brand .payroll-overtime-table td {
  vertical-align: middle;
}

html.fenisa-brand .payroll-overtime-hours {
  color: var(--fenisa-ink);
  font-weight: 700;
  white-space: nowrap;
}

html.fenisa-brand .payroll-overtime-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 9px;
  border-radius: 18px;
  background: #fff3d9;
  color: #8a5a00;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

html.fenisa-brand .payroll-overtime-status.status-approved {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-overtime-status.status-rejected {
  background: #fce9e9;
  color: #99151b;
}

html.fenisa-brand .payroll-overtime-reviewer {
  display: block;
  margin-top: 4px;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-overtime-review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

html.fenisa-brand .payroll-overtime-review-actions .inline-form {
  display: inline-block;
  margin: 0;
}

@media (max-width: 991px) {
  html.fenisa-brand .payroll-overtime-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-overtime-summary {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .payroll-overtime-form {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .payroll-overtime-submit .btn {
    width: 100%;
  }

  html.fenisa-brand .payroll-overtime-panel-heading,
  html.fenisa-brand .payroll-overtime-history-heading {
    align-items: flex-start;
    padding: 16px;
  }
}

html.fenisa-brand .fenisa-timeclock-page {
  max-width: 1160px;
  margin: 20px auto 0;
}

html.fenisa-brand .fenisa-timeclock-location-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #f0c4c6;
  border-radius: 9px;
  box-shadow: 0 3px 12px rgba(32, 32, 35, 0.04);
}

html.fenisa-brand .fenisa-timeclock-location-alert i {
  font-size: 20px;
}

html.fenisa-brand .fenisa-timeclock-card {
  position: relative;
  overflow: hidden;
  padding: 28px;
  border: 1px solid var(--fenisa-border);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 12px 34px rgba(32, 32, 35, 0.09);
}

html.fenisa-brand .fenisa-timeclock-card:before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 5px;
  background: var(--fenisa-red);
  content: "";
}

html.fenisa-brand .fenisa-timeclock-card-top,
html.fenisa-brand .fenisa-timeclock-brand,
html.fenisa-brand .fenisa-timeclock-live,
html.fenisa-brand .fenisa-timeclock-employee,
html.fenisa-brand .fenisa-timeclock-status,
html.fenisa-brand .fenisa-timeclock-buttons,
html.fenisa-brand .fenisa-timeclock-footer-links,
html.fenisa-brand .fenisa-timeclock-completed {
  display: flex;
  align-items: center;
}

html.fenisa-brand .fenisa-timeclock-card-top {
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--fenisa-border);
}

html.fenisa-brand .fenisa-timeclock-brand {
  gap: 14px;
}

html.fenisa-brand .fenisa-timeclock-icon,
html.fenisa-brand .fenisa-timeclock-avatar {
  display: flex;
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 27px;
}

html.fenisa-brand .fenisa-timeclock-eyebrow {
  margin-bottom: 4px;
  color: var(--fenisa-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

html.fenisa-brand .fenisa-timeclock-brand h1 {
  margin: 0;
  font-size: 23px;
}

html.fenisa-brand .fenisa-timeclock-live {
  min-width: 195px;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1.4;
}

html.fenisa-brand .fenisa-timeclock-live span,
html.fenisa-brand .fenisa-timeclock-live small {
  color: var(--fenisa-muted);
}

html.fenisa-brand .fenisa-timeclock-live strong {
  color: var(--fenisa-ink);
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

html.fenisa-brand .fenisa-timeclock-live-dot,
html.fenisa-brand .fenisa-timeclock-status-indicator {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #32a05a;
  box-shadow: 0 0 0 4px rgba(50, 160, 90, 0.12);
}

html.fenisa-brand .fenisa-timeclock-live-dot {
  margin: 0 0 4px;
}

html.fenisa-brand .fenisa-timeclock-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 24px 0;
  padding: 18px;
  border: 1px solid #ececef;
  border-radius: 10px;
  background: #fafafa;
}

html.fenisa-brand .fenisa-timeclock-employee {
  gap: 12px;
}

html.fenisa-brand .fenisa-timeclock-avatar {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid var(--fenisa-border);
  font-size: 20px;
}

html.fenisa-brand .fenisa-timeclock-employee > div:last-child,
html.fenisa-brand .fenisa-timeclock-status > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

html.fenisa-brand .fenisa-timeclock-employee span {
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .fenisa-timeclock-employee strong {
  color: var(--fenisa-ink);
  font-size: 15px;
}

html.fenisa-brand .fenisa-timeclock-employee small {
  color: var(--fenisa-muted);
}

html.fenisa-brand .fenisa-timeclock-status {
  gap: 12px;
}

html.fenisa-brand .fenisa-timeclock-status strong {
  color: #26723e;
  font-size: 14px;
}

html.fenisa-brand .fenisa-timeclock-status small {
  color: var(--fenisa-muted);
}

html.fenisa-brand .fenisa-timeclock-card.is-clocked-out .fenisa-timeclock-status-indicator {
  background: #a3a3aa;
  box-shadow: 0 0 0 4px rgba(113, 113, 122, 0.12);
}

html.fenisa-brand .fenisa-timeclock-card.is-clocked-out .fenisa-timeclock-status strong {
  color: #55555d;
}

html.fenisa-brand .fenisa-timeclock-comment {
  margin-bottom: 17px;
}

html.fenisa-brand .fenisa-timeclock-comment label {
  display: block;
  margin-bottom: 7px;
  color: var(--fenisa-ink);
  font-weight: 600;
}

html.fenisa-brand .fenisa-timeclock-comment label span {
  margin-left: 4px;
  color: var(--fenisa-muted);
  font-size: 12px;
  font-weight: 400;
}

html.fenisa-brand .fenisa-timeclock-comment textarea {
  min-height: 76px;
  resize: vertical;
}

html.fenisa-brand .fenisa-timeclock-buttons {
  flex-wrap: wrap;
  gap: 10px;
}

html.fenisa-brand .fenisa-timeclock-primary,
html.fenisa-brand .fenisa-timeclock-secondary {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 7px;
  font-size: 14px;
  font-weight: 600;
}

html.fenisa-brand .fenisa-timeclock-primary i,
html.fenisa-brand .fenisa-timeclock-secondary i {
  font-size: 18px;
}

html.fenisa-brand .fenisa-timeclock-card .btn-danger.fenisa-timeclock-primary {
  color: #ffffff;
  background-color: #a91820;
  border-color: #a91820;
}

html.fenisa-brand .fenisa-timeclock-card .btn-danger.fenisa-timeclock-primary:hover {
  background-color: #8f1118;
  border-color: #8f1118;
}

html.fenisa-brand .fenisa-timeclock-card .fenisa-timeclock-secondary {
  background: #ffffff;
}

html.fenisa-brand .fenisa-timeclock-primary.is-loading {
  opacity: 0.7;
  pointer-events: none;
}

html.fenisa-brand .fenisa-timeclock-footer-links {
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--fenisa-border);
}

html.fenisa-brand .fenisa-timeclock-text-link {
  color: var(--fenisa-red-dark);
  font-size: 13px;
  font-weight: 600;
}

html.fenisa-brand .fenisa-timeclock-completed {
  justify-content: space-between;
  gap: 12px;
}

html.fenisa-brand .fenisa-timeclock-completed-message {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #26723e;
  font-weight: 600;
}

html.fenisa-brand .fenisa-timeclock-completed-message i {
  font-size: 21px;
}

@media (max-width: 767px) {
  html.fenisa-brand .fenisa-timeclock-page {
    margin-top: 12px;
  }

  html.fenisa-brand .fenisa-timeclock-card {
    padding: 20px 16px;
  }

  html.fenisa-brand .fenisa-timeclock-card-top {
    align-items: flex-start;
    flex-direction: column;
  }

  html.fenisa-brand .fenisa-timeclock-live {
    align-items: flex-start;
    padding-left: 66px;
  }

  html.fenisa-brand .fenisa-timeclock-main {
    align-items: flex-start;
    flex-direction: column;
    gap: 18px;
    padding: 14px;
  }

  html.fenisa-brand .fenisa-timeclock-buttons {
    align-items: stretch;
    flex-direction: column;
  }

  html.fenisa-brand .fenisa-timeclock-buttons .btn {
    width: 100%;
  }
}

html.fenisa-brand .payroll-attendance-page {
  max-width: 1500px;
  margin: 0 auto;
}

html.fenisa-brand .payroll-attendance-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 8px 0 20px;
}

html.fenisa-brand .payroll-attendance-header h2 {
  margin: 0 0 5px;
  font-size: 25px;
}

html.fenisa-brand .payroll-attendance-header p,
html.fenisa-brand .payroll-attendance-history-heading p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-attendance-header-icon {
  display: flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 27px;
}

html.fenisa-brand .payroll-attendance-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

html.fenisa-brand .payroll-punch-card {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 20px;
  padding: 22px 24px;
  border: 1px solid #eed0d2;
  background: linear-gradient(120deg, #fffafa, #ffffff 65%);
}

html.fenisa-brand .payroll-punch-card-icon {
  display: flex;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #fce9e9;
  color: var(--fenisa-red-dark);
  font-size: 29px;
}

html.fenisa-brand .payroll-punch-card-info {
  flex: 1 1 auto;
}

html.fenisa-brand .payroll-punch-eyebrow {
  color: var(--fenisa-red-dark);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-punch-card-info h3 {
  margin: 4px 0;
  font-size: 19px;
}

html.fenisa-brand .payroll-punch-card-info p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-punch-form {
  display: flex;
  align-items: center;
  gap: 9px;
}

html.fenisa-brand .payroll-punch-form .form-control {
  min-width: 190px;
}

html.fenisa-brand .payroll-punch-button {
  min-height: 40px;
  white-space: nowrap;
}

html.fenisa-brand .payroll-attendance-history-heading {
  padding: 18px 22px;
  background: #fffafa;
  border-bottom: 1px solid var(--fenisa-border);
}

html.fenisa-brand .payroll-attendance-history-heading h3 {
  margin: 0 0 5px;
  font-size: 18px;
}

html.fenisa-brand .payroll-attendance-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 20px;
  padding: 16px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  background: #fafafa;
}

html.fenisa-brand .payroll-attendance-filters .form-group {
  min-width: 155px;
  margin: 0;
}

html.fenisa-brand .payroll-attendance-filters .form-group:first-child {
  min-width: 235px;
  flex: 1 1 235px;
}

html.fenisa-brand .payroll-attendance-filters label {
  display: block;
  margin-bottom: 5px;
  font-weight: 600;
}

html.fenisa-brand .payroll-attendance-table td {
  vertical-align: middle;
}

html.fenisa-brand .payroll-attendance-status {
  display: inline-block;
  padding: 4px 9px;
  border-radius: 18px;
  background: #f0f0f2;
  color: #55555d;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

html.fenisa-brand .payroll-attendance-status.status-completed,
html.fenisa-brand .payroll-attendance-status.status-worked {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-attendance-status.status-in_progress,
html.fenisa-brand .payroll-attendance-status.status-pending {
  background: #fff3d9;
  color: #8a5a00;
}

html.fenisa-brand .payroll-attendance-status.status-absence {
  background: #fce9e9;
  color: #99151b;
}

html.fenisa-brand .payroll-attendance-footnote {
  margin: 12px 0 0;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-attendance-empty {
  padding: 28px 16px;
  text-align: center;
}

html.fenisa-brand .payroll-attendance-empty .payroll-empty-icon {
  margin: 0 auto 12px;
}

html.fenisa-brand .payroll-attendance-empty p {
  margin-bottom: 0;
  color: var(--fenisa-muted);
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-attendance-header-actions {
    align-items: flex-end;
    flex-direction: column-reverse;
  }

  html.fenisa-brand .payroll-punch-card {
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 18px;
  }

  html.fenisa-brand .payroll-punch-card-actions {
    width: 100%;
  }

  html.fenisa-brand .payroll-punch-form {
    align-items: stretch;
    flex-direction: column;
  }

  html.fenisa-brand .payroll-punch-form .form-control {
    min-width: 0;
  }

  html.fenisa-brand .payroll-attendance-filters .form-group,
  html.fenisa-brand .payroll-attendance-filters .form-group:first-child {
    width: 100%;
    min-width: 0;
    flex: 1 1 100%;
  }
}

html.fenisa-brand .flip-container .front {
  overflow: hidden;
  border: 1px solid var(--fenisa-border);
  border-radius: 14px;
  box-shadow: 0 20px 60px rgba(20, 13, 14, 0.2);
}

html.fenisa-brand .flip-container .heading {
  background: var(--fenisa-ink);
  border-bottom: 4px solid var(--fenisa-red);
}

html.fenisa-brand .flip-container .heading img {
  max-width: 180px;
  max-height: 180px;
  object-fit: contain;
  border-radius: 6px;
}

html.fenisa-brand .flip-container .holder input {
  background-color: #ffffff;
  border-color: var(--fenisa-border);
}

html.fenisa-brand .flip-container .btn {
  border-radius: 7px;
  font-weight: 600;
  letter-spacing: 0.035em;
}

html.fenisa-brand body.fenisa-login {
  min-height: 100vh !important;
  background: radial-gradient(ellipse at top, #443033 0%, #211d20 48%, #171719 100%);
}

html.fenisa-brand .fenisa-attribution {
  display: block;
  margin: 14px 0 2px;
  color: var(--fenisa-muted);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.025em;
  text-align: center;
}

html.fenisa-brand .fenisa-attribution strong {
  color: var(--fenisa-red-dark);
  font-weight: 700;
}

html.fenisa-brand #footers {
  padding: 12px 15px;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .fenisa-attribution-separator {
  padding: 0 5px;
  color: #c5c6cb;
}

html.fenisa-brand.fenisa-dark body {
  background-color: #1c1c20;
  color: #e7e5e5;
}

html.fenisa-brand.fenisa-dark h1,
html.fenisa-brand.fenisa-dark h2,
html.fenisa-brand.fenisa-dark h3,
html.fenisa-brand.fenisa-dark h4,
html.fenisa-brand.fenisa-dark h5 {
  color: #f4f1f1;
}

html.fenisa-brand.fenisa-dark .panel,
html.fenisa-brand.fenisa-dark .panel-piluku,
html.fenisa-brand.fenisa-dark .modal-content,
html.fenisa-brand.fenisa-dark .dropdown-menu,
html.fenisa-brand.fenisa-dark .panel-piluku > .panel-heading,
html.fenisa-brand.fenisa-dark .manage-table .panel-heading {
  background-color: #27262a;
  border-color: #3d393d;
  color: #e7e5e5;
}

html.fenisa-brand.fenisa-dark .panel-piluku > .panel-heading h3,
html.fenisa-brand.fenisa-dark .panel-piluku.panel-primary > .panel-heading h3,
html.fenisa-brand.fenisa-dark .dropdown-menu > li > a {
  color: #f4f1f1 !important;
}

html.fenisa-brand.fenisa-dark .form-control,
html.fenisa-brand.fenisa-dark .select2-container .select2-choice,
html.fenisa-brand.fenisa-dark .select2-container-multi .select2-choices {
  background-color: #302e33;
  border-color: #4b474d;
  color: #f4f1f1;
}

html.fenisa-brand.fenisa-dark .table > thead > tr > th,
html.fenisa-brand.fenisa-dark .table thead th {
  background-color: #30282a;
  border-color: #4b3a3c;
  color: #f4f1f1;
}

html.fenisa-brand.fenisa-dark .table > tbody > tr:hover,
html.fenisa-brand.fenisa-dark .table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #2d292c;
}

html.fenisa-brand.fenisa-dark .flip-container .front {
  background-color: #27262a;
}

html.fenisa-brand.fenisa-dark .flip-container .holder input {
  background-color: #302e33;
  color: #f4f1f1;
}

@media (max-width: 767px) {
  html.fenisa-brand .top-bar,
  html.fenisa-brand .top-bar nav.navbar,
  html.fenisa-brand .top-bar .navbar-default {
    min-height: 56px;
  }

  html.fenisa-brand .dashboard-stats {
    min-height: 88px;
    padding-left: 14px;
  }

  html.fenisa-brand .dashboard-stats .right,
  html.fenisa-brand .dashboard-stats .right.flatBlue,
  html.fenisa-brand .dashboard-stats .right.flatGreen,
  html.fenisa-brand .dashboard-stats .right.flatRed,
  html.fenisa-brand .dashboard-stats .right.flatOrange {
    width: 28%;
  }

  html.fenisa-brand .dashboard-stats .right img {
    width: 34px;
    height: 34px;
  }

  html.fenisa-brand .top-bar .avatar-holder {
    width: 42px;
    height: 42px;
    margin-right: 4px;
  }

  html.fenisa-brand .left-bar .admin-logo,
  html.fenisa-brand .side-bar .admin-logo {
    min-height: 74px;
  }

  html.fenisa-brand .left-bar .admin-logo .logo-holder .logo,
  html.fenisa-brand .side-bar .admin-logo .logo-holder .logo {
    width: 60px;
    height: 60px;
  }

  html.fenisa-brand .left-bar .menu-parent,
  html.fenisa-brand .side-bar .menu-parent {
    padding-top: 80px;
  }

  html.fenisa-brand .flip-container {
    width: 100%;
    margin-top: 24px;
  }
}

@media print {
  html.fenisa-brand body {
    background: #ffffff !important;
    color: #000000 !important;
    font-family: Arial, sans-serif !important;
  }

  html.fenisa-brand .panel,
  html.fenisa-brand .panel-piluku {
    box-shadow: none !important;
  }
}

html.fenisa-brand {
  --fenisa-red: #111111;
  --fenisa-red-dark: #000000;
  --fenisa-red-action: #111111;
  --fenisa-red-action-hover: #333333;
  --fenisa-red-soft: #f2f2f2;
  --fenisa-ink: #000000;
  --fenisa-text: #111111;
  --fenisa-muted: #444444;
  --fenisa-border: #d0d0d0;
  --fenisa-canvas: #f2f2f2;
  --fenisa-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

html.fenisa-brand body,
html.fenisa-brand body * {
  color: #111111 !important;
}

html.fenisa-brand body {
  background: #f2f2f2 !important;
}

html.fenisa-brand a,
html.fenisa-brand a:hover,
html.fenisa-brand a:focus {
  color: #111111 !important;
}

html.fenisa-brand .left-bar,
html.fenisa-brand .side-bar,
html.fenisa-brand .top-bar,
html.fenisa-brand .top-bar nav.navbar,
html.fenisa-brand .top-bar .navbar-default,
html.fenisa-brand .left-bar .admin-logo,
html.fenisa-brand .side-bar .admin-logo {
  background: #000000 !important;
  border-color: #ffffff !important;
  color: #ffffff !important;
}

html.fenisa-brand .left-bar *,
html.fenisa-brand .side-bar *,
html.fenisa-brand .top-bar .navbar-nav > li > a,
html.fenisa-brand .top-bar .navbar-nav > li > a *,
html.fenisa-brand .top-bar .navbar-breadcrumb,
html.fenisa-brand .top-bar .navbar-breadcrumb *,
html.fenisa-brand .top-bar .menu-bar-mobile,
html.fenisa-brand .left-bar .admin-logo *,
html.fenisa-brand .side-bar .admin-logo * {
  color: #ffffff !important;
}

html.fenisa-brand .left-bar .menu-parent > li,
html.fenisa-brand .side-bar .menu-parent > li,
html.fenisa-brand .left-bar .menu-parent > li.active,
html.fenisa-brand .left-bar .menu-parent > li:hover,
html.fenisa-brand .side-bar .menu-parent > li.active,
html.fenisa-brand .side-bar .menu-parent > li:hover,
html.fenisa-brand #mainMenu li ul {
  background: #000000 !important;
}

html.fenisa-brand .left-bar .menu-parent > li.active,
html.fenisa-brand .left-bar .menu-parent > li:hover,
html.fenisa-brand .side-bar .menu-parent > li.active,
html.fenisa-brand .side-bar .menu-parent > li:hover {
  border-left-color: #ffffff !important;
  box-shadow: inset 3px 0 #ffffff;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu,
html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu li,
html.fenisa-brand .dropdown-menu,
html.fenisa-brand .dropdown-menu > li > a {
  background: #ffffff !important;
  color: #111111 !important;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu a,
html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu a:hover,
html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu a:focus {
  background: #ffffff !important;
  color: #111111 !important;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu *,
html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu *:before,
html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu *:after {
  color: #111111 !important;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu a:hover,
html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu a:hover * {
  background: #eeeeee !important;
  color: #000000 !important;
}

html.fenisa-brand .top-bar .top-elements .dropdown .dropdown-menu .badge {
  background: #111111 !important;
  color: #ffffff !important;
}

html.fenisa-brand .top-bar .top-elements .language-switcher {
  display: none !important;
}

html.fenisa-brand .btn,
html.fenisa-brand button,
html.fenisa-brand input[type="button"],
html.fenisa-brand input[type="submit"],
html.fenisa-brand input[type="reset"],
html.fenisa-brand .btn-primary,
html.fenisa-brand .btn-primary:hover,
html.fenisa-brand .btn-primary:focus,
html.fenisa-brand .btn-primary:active,
html.fenisa-brand .btn-primary.active,
html.fenisa-brand .btn-danger,
html.fenisa-brand .btn-danger:hover,
html.fenisa-brand .btn-danger:focus,
html.fenisa-brand .btn-danger:active,
html.fenisa-brand .btn-success,
html.fenisa-brand .btn-success:hover,
html.fenisa-brand .btn-success:focus,
html.fenisa-brand .btn-warning,
html.fenisa-brand .btn-warning:hover,
html.fenisa-brand .btn-warning:focus,
html.fenisa-brand .btn-info,
html.fenisa-brand .btn-info:hover,
html.fenisa-brand .btn-info:focus {
  background: #000000 !important;
  border-color: #000000 !important;
  color: #ffffff !important;
  text-shadow: none !important;
  box-shadow: none;
}

html.fenisa-brand .btn:hover,
html.fenisa-brand button:hover,
html.fenisa-brand input[type="button"]:hover,
html.fenisa-brand input[type="submit"]:hover,
html.fenisa-brand input[type="reset"]:hover {
  background: #333333 !important;
  border-color: #333333 !important;
  color: #ffffff !important;
}

html.fenisa-brand .btn-default,
html.fenisa-brand .btn-default:hover,
html.fenisa-brand .btn-default:focus,
html.fenisa-brand .btn-link,
html.fenisa-brand .btn-link:hover {
  background: #ffffff !important;
  border-color: #111111 !important;
  color: #111111 !important;
}

html.fenisa-brand .btn[disabled],
html.fenisa-brand .btn.disabled,
html.fenisa-brand button[disabled],
html.fenisa-brand input[disabled] {
  background: #e5e5e5 !important;
  border-color: #bdbdbd !important;
  color: #333333 !important;
  opacity: 1;
}

html.fenisa-brand .form-control,
html.fenisa-brand input,
html.fenisa-brand select,
html.fenisa-brand textarea,
html.fenisa-brand .select2-container .select2-choice,
html.fenisa-brand .select2-container-multi .select2-choices,
html.fenisa-brand .selectize-input,
html.fenisa-brand .token-input-list {
  background-color: #ffffff !important;
  border-color: #777777 !important;
  color: #111111 !important;
}

html.fenisa-brand .form-control::placeholder,
html.fenisa-brand input::placeholder,
html.fenisa-brand textarea::placeholder {
  color: #555555 !important;
  opacity: 1;
}

html.fenisa-brand .input-group-addon,
html.fenisa-brand .input-group-btn .btn {
  background: #ffffff !important;
  border-color: #777777 !important;
  color: #111111 !important;
}

html.fenisa-brand .panel,
html.fenisa-brand .panel-piluku,
html.fenisa-brand .panel-heading,
html.fenisa-brand .panel-body,
html.fenisa-brand .modal-content,
html.fenisa-brand .modal-header,
html.fenisa-brand .modal-body,
html.fenisa-brand .modal-footer,
html.fenisa-brand .manage-table .panel-heading,
html.fenisa-brand .panel-piluku > .panel-heading,
html.fenisa-brand .dashboard-stats,
html.fenisa-brand .quick-actions .list-group-item,
html.fenisa-brand .quick-actions .list-group-item:hover,
html.fenisa-brand .quick-actions .list-group-item:focus {
  background: #ffffff !important;
  border-color: #d0d0d0 !important;
  color: #111111 !important;
}

html.fenisa-brand .table,
html.fenisa-brand .table > thead > tr > th,
html.fenisa-brand .table > tbody > tr > td,
html.fenisa-brand .table > tfoot > tr > td,
html.fenisa-brand .table > tbody > tr,
html.fenisa-brand .table-striped > tbody > tr:nth-of-type(odd),
html.fenisa-brand .table > tbody > tr:hover {
  background: #ffffff !important;
  color: #111111 !important;
}

html.fenisa-brand .table > thead > tr > th {
  background: #eeeeee !important;
  border-color: #c8c8c8 !important;
  color: #000000 !important;
}

html.fenisa-brand .nav-tabs > li > a,
html.fenisa-brand .nav-tabs > li.active > a,
html.fenisa-brand .nav-tabs > li.active > a:hover,
html.fenisa-brand .nav-tabs > li.active > a:focus,
html.fenisa-brand .nav-tabs.piluku-tabs > li.active > a,
html.fenisa-brand .nav-tabs.piluku-tabs > li.active > a:hover,
html.fenisa-brand .nav-tabs.piluku-tabs > li.active > a:focus,
html.fenisa-brand .pagination > .active > a,
html.fenisa-brand .pagination > .active > span {
  background: #000000 !important;
  border-color: #000000 !important;
  color: #ffffff !important;
}

html.fenisa-brand .pagination > li > a,
html.fenisa-brand .pagination > li > span {
  background: #ffffff !important;
  border-color: #c8c8c8 !important;
  color: #111111 !important;
}

html.fenisa-brand .label,
html.fenisa-brand .badge,
html.fenisa-brand .info-number,
html.fenisa-brand .info-number.count,
html.fenisa-brand .label-primary,
html.fenisa-brand .label-danger,
html.fenisa-brand .label-warning,
html.fenisa-brand .label-success,
html.fenisa-brand .label-info,
html.fenisa-brand .progress-bar,
html.fenisa-brand .progress-bar-primary,
html.fenisa-brand .progress-bar-danger,
html.fenisa-brand .progress-bar-warning,
html.fenisa-brand .progress-bar-success,
html.fenisa-brand .progress-bar-info {
  background: #000000 !important;
  border-color: #000000 !important;
  color: #ffffff !important;
  text-shadow: none !important;
}

html.fenisa-brand .text-warning,
html.fenisa-brand .text-danger,
html.fenisa-brand .text-success,
html.fenisa-brand .text-info,
html.fenisa-brand .text-primary,
html.fenisa-brand .text-muted,
html.fenisa-brand .flatBluec,
html.fenisa-brand .flatGreenc,
html.fenisa-brand .flatRedc,
html.fenisa-brand .flatOrangec {
  color: #111111 !important;
}

html.fenisa-brand .alert,
html.fenisa-brand .alert-warning,
html.fenisa-brand .alert-danger,
html.fenisa-brand .alert-success,
html.fenisa-brand .alert-info,
html.fenisa-brand .well,
html.fenisa-brand .bg-warning,
html.fenisa-brand .bg-danger,
html.fenisa-brand .bg-success,
html.fenisa-brand .bg-info {
  background: #ffffff !important;
  border-color: #777777 !important;
  color: #111111 !important;
}

html.fenisa-brand .dashboard-stats .left h3,
html.fenisa-brand .dashboard-stats .left h3.flatBluec,
html.fenisa-brand .dashboard-stats .left h3.flatGreenc,
html.fenisa-brand .dashboard-stats .left h3.flatRedc,
html.fenisa-brand .dashboard-stats .left h3.flatOrangec,
html.fenisa-brand .dashboard-stats .left h4,
html.fenisa-brand .dashboard-stats .right,
html.fenisa-brand .dashboard-stats .right.flatBlue,
html.fenisa-brand .dashboard-stats .right.flatGreen,
html.fenisa-brand .dashboard-stats .right.flatRed,
html.fenisa-brand .dashboard-stats .right.flatOrange {
  background: #ffffff !important;
  color: #111111 !important;
}

html.fenisa-brand .dashboard-stats .right {
  border: 1px solid #d0d0d0 !important;
}

html.fenisa-brand .chart .ct-series-a .ct-line,
html.fenisa-brand .chart .ct-series-a .ct-point,
html.fenisa-brand .chart .ct-series-a .ct-bar {
  stroke: #111111 !important;
}

html.fenisa-brand .chart .ct-series-a .ct-area,
html.fenisa-brand .chart .ct-series-a .ct-slice-pie {
  fill: #111111 !important;
}

html.fenisa-brand .chart-parent .ct-chart .ct-series .ct-bar,
html.fenisa-brand .chart-parent .ct-chart .ct-series .ct-line,
html.fenisa-brand .chart-parent .ct-chart .ct-series .ct-point,
html.fenisa-brand .chart-parent .ct-chart .ct-series .ct-slice.ct-donut {
  stroke: #777777 !important;
}

html.fenisa-brand .chart-parent .ct-chart .ct-series-a .ct-bar,
html.fenisa-brand .chart-parent .ct-chart .ct-series-a .ct-line,
html.fenisa-brand .chart-parent .ct-chart .ct-series-a .ct-point,
html.fenisa-brand .chart-parent .ct-chart .ct-series-a .ct-slice.ct-donut,
html.fenisa-brand .chart-parent .ct-chart .ct-series-a .ct-area,
html.fenisa-brand .chart-parent .ct-chart .ct-series-a .ct-slice-pie {
  stroke: #111111 !important;
  fill: #111111 !important;
}

html.fenisa-brand .chart-parent .ct-chart .ct-series-b .ct-bar,
html.fenisa-brand .chart-parent .ct-chart .ct-series-b .ct-line,
html.fenisa-brand .chart-parent .ct-chart .ct-series-b .ct-point,
html.fenisa-brand .chart-parent .ct-chart .ct-series-b .ct-slice.ct-donut,
html.fenisa-brand .chart-parent .ct-chart .ct-series-b .ct-area,
html.fenisa-brand .chart-parent .ct-chart .ct-series-b .ct-slice-pie {
  stroke: #555555 !important;
  fill: #555555 !important;
}

html.fenisa-brand .chart-parent .ct-chart .ct-series-c .ct-bar,
html.fenisa-brand .chart-parent .ct-chart .ct-series-c .ct-line,
html.fenisa-brand .chart-parent .ct-chart .ct-series-c .ct-point,
html.fenisa-brand .chart-parent .ct-chart .ct-series-c .ct-slice.ct-donut,
html.fenisa-brand .chart-parent .ct-chart .ct-series-c .ct-area,
html.fenisa-brand .chart-parent .ct-chart .ct-series-c .ct-slice-pie {
  stroke: #888888 !important;
  fill: #888888 !important;
}

html.fenisa-brand .chart-parent .ct-chart .ct-series-d .ct-bar,
html.fenisa-brand .chart-parent .ct-chart .ct-series-d .ct-line,
html.fenisa-brand .chart-parent .ct-chart .ct-series-d .ct-point,
html.fenisa-brand .chart-parent .ct-chart .ct-series-d .ct-slice.ct-donut,
html.fenisa-brand .chart-parent .ct-chart .ct-series-d .ct-area,
html.fenisa-brand .chart-parent .ct-chart .ct-series-d .ct-slice-pie {
  stroke: #aaaaaa !important;
  fill: #aaaaaa !important;
}

html.fenisa-brand .fenisa-attribution,
html.fenisa-brand .fenisa-attribution strong,
html.fenisa-brand #footers,
html.fenisa-brand .fenisa-attribution-separator {
  color: #333333 !important;
}

html.fenisa-brand.fenisa-dark body,
html.fenisa-brand.fenisa-dark .content,
html.fenisa-brand.fenisa-dark .main-content {
  background: #f2f2f2 !important;
  color: #111111 !important;
}

html.fenisa-brand.fenisa-dark .panel,
html.fenisa-brand.fenisa-dark .panel-piluku,
html.fenisa-brand.fenisa-dark .panel-heading,
html.fenisa-brand.fenisa-dark .panel-body,
html.fenisa-brand.fenisa-dark .modal-content,
html.fenisa-brand.fenisa-dark .modal-header,
html.fenisa-brand.fenisa-dark .modal-body,
html.fenisa-brand.fenisa-dark .modal-footer,
html.fenisa-brand.fenisa-dark .manage-table .panel-heading {
  background: #ffffff !important;
  color: #111111 !important;
}

@media print {
  html.fenisa-brand body {
    background: #ffffff !important;
    color: #000000 !important;
  }
}

html.fenisa-brand .table-responsive,
html.fenisa-brand .dataTables_wrapper,
html.fenisa-brand .table_holder {
  max-width: 100%;
}

html.fenisa-brand .table-responsive {
  overflow-x: auto !important;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}

html.fenisa-brand .payroll-vacations-page {
  max-width: 1500px;
  margin: 0 auto;
}

html.fenisa-brand .payroll-vacations-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 8px 0 18px;
}

html.fenisa-brand .payroll-vacations-header h2 {
  margin: 0 0 5px;
  font-size: 25px;
}

html.fenisa-brand .payroll-vacations-header p,
html.fenisa-brand .payroll-vacation-panel-heading p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-vacations-header-icon {
  display: flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 26px;
}

html.fenisa-brand .payroll-vacations-notice {
  margin-bottom: 16px;
  padding: 11px 14px;
  border: 1px solid #eadfbf;
  border-radius: 7px;
  background: #fffaf0;
  color: #6e5a2b;
  font-size: 12px;
  line-height: 1.5;
}

html.fenisa-brand .payroll-vacations-notice i {
  margin-right: 5px;
}

html.fenisa-brand .payroll-vacations-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

html.fenisa-brand .payroll-vacation-summary-card {
  display: flex;
  min-height: 84px;
  align-items: center;
  gap: 12px;
  padding: 15px;
  border: 1px solid var(--fenisa-border);
  border-radius: 9px;
  background: #ffffff;
  box-shadow: 0 3px 12px rgba(32, 32, 35, 0.04);
}

html.fenisa-brand .payroll-vacation-summary-card .summary-icon,
html.fenisa-brand .payroll-vacation-panel-heading .panel-heading-icon {
  display: flex;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 21px;
}

html.fenisa-brand .payroll-vacation-summary-card .summary-icon.used {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-vacation-summary-card .summary-icon.reserved {
  background: #fff3d9;
  color: #8a5a00;
}

html.fenisa-brand .payroll-vacation-summary-card .summary-icon.available,
html.fenisa-brand .payroll-vacation-panel-heading .panel-heading-icon.balance {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-vacation-summary-card > div:last-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

html.fenisa-brand .payroll-vacation-summary-card strong {
  color: var(--fenisa-ink);
  font-size: 20px;
  line-height: 1.3;
}

html.fenisa-brand .payroll-vacation-summary-card span {
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-vacation-panel {
  margin-bottom: 18px;
  overflow: hidden;
}

html.fenisa-brand .payroll-vacation-panel-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 17px 20px;
  border-bottom: 1px solid var(--fenisa-border);
  background: #fffafa;
}

html.fenisa-brand .payroll-vacation-panel-heading h3 {
  margin: 0 0 4px;
  font-size: 16px;
}

html.fenisa-brand .payroll-vacation-panel-heading p {
  font-size: 12px;
  line-height: 1.4;
}

html.fenisa-brand .payroll-vacation-panel-heading .panel-heading-icon.report {
  background: #fff3d9;
  color: #8a5a00;
}

html.fenisa-brand .payroll-vacation-panel .panel-body {
  padding: 18px 20px;
}

html.fenisa-brand .payroll-vacation-form .form-group,
html.fenisa-brand .payroll-vacation-filters .form-group {
  margin-bottom: 14px;
}

html.fenisa-brand .payroll-vacation-form label,
html.fenisa-brand .payroll-vacation-filters label {
  display: block;
  margin-bottom: 5px;
  color: var(--fenisa-ink);
  font-weight: 600;
}

html.fenisa-brand .payroll-vacation-form label .required {
  color: var(--fenisa-red);
}

html.fenisa-brand .payroll-vacation-form .help-block {
  margin-top: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-vacation-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  background: #fafafa;
}

html.fenisa-brand .payroll-vacation-filters .form-group {
  min-width: 170px;
  margin: 0;
}

html.fenisa-brand .payroll-vacation-table td {
  vertical-align: middle;
}

html.fenisa-brand .payroll-vacation-table tbody tr:hover {
  background: #f4f8fb;
}

html.fenisa-brand .payroll-vacation-table .btn-default {
  border-color: #c6d2dc;
  color: #27465f;
  font-weight: 600;
}

html.fenisa-brand #vacation-request-history {
  scroll-margin-top: 24px;
}

html.fenisa-brand #vacation-request-history:target {
  outline: 3px solid rgba(23, 86, 120, 0.18);
  outline-offset: 3px;
}

html.fenisa-brand .payroll-vacation-table td small {
  display: block;
  margin-top: 3px;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-vacation-status {
  display: inline-block;
  padding: 4px 9px;
  border-radius: 18px;
  background: #fff3d9;
  color: #8a5a00;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

html.fenisa-brand .payroll-vacation-status.status-approved {
  background: #e8f5ec;
  color: #26723e;
}

html.fenisa-brand .payroll-vacation-status.status-rejected {
  background: #fce9e9;
  color: #a52222;
}

html.fenisa-brand .payroll-vacation-empty {
  padding: 26px 16px;
  text-align: center;
}

html.fenisa-brand .payroll-vacation-empty > i {
  color: var(--fenisa-red-dark);
  font-size: 30px;
}

html.fenisa-brand .payroll-vacation-empty h4 {
  margin: 8px 0 4px;
}

html.fenisa-brand .payroll-vacation-empty p {
  margin: 0;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-vacation-permission {
  max-width: 900px;
  margin: 0 auto;
}

html.fenisa-brand .payroll-vacation-permission-actions {
  display: flex;
  justify-content: space-between;
  margin: 12px 0;
}

html.fenisa-brand .payroll-vacation-permission-sheet {
  padding: 38px 42px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  background: #ffffff;
}

html.fenisa-brand .payroll-vacation-permission-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 18px;
  border-bottom: 2px solid var(--fenisa-red-dark);
}

html.fenisa-brand .payroll-vacation-permission-header span,
html.fenisa-brand .payroll-vacation-permission-header small {
  display: block;
  color: var(--fenisa-muted);
}

html.fenisa-brand .payroll-vacation-permission-header h1 {
  margin: 4px 0 0;
  font-size: 24px;
}

html.fenisa-brand .payroll-vacation-permission-header .permission-reference {
  text-align: right;
  font-size: 16px;
  font-weight: 700;
}

html.fenisa-brand .payroll-vacation-permission-header small {
  margin-top: 5px;
  font-size: 11px;
  font-weight: 400;
}

html.fenisa-brand .payroll-vacation-permission-status {
  margin: 16px 0;
  padding: 10px 12px;
  border: 1px solid var(--fenisa-border);
  background: #fafafa;
}

html.fenisa-brand .payroll-vacation-permission-sheet section {
  margin-top: 24px;
}

html.fenisa-brand .payroll-vacation-permission-sheet section h2 {
  margin: 0 0 12px;
  padding-bottom: 7px;
  border-bottom: 1px solid var(--fenisa-border);
  font-size: 15px;
}

html.fenisa-brand .permission-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px 24px;
}

html.fenisa-brand .permission-grid > div,
html.fenisa-brand .permission-approval > div {
  display: flex;
  min-height: 40px;
  flex-direction: column;
  gap: 4px;
}

html.fenisa-brand .permission-grid span,
html.fenisa-brand .permission-approval span {
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .permission-full {
  grid-column: 1 / -1;
}

html.fenisa-brand .permission-approval p {
  margin-bottom: 30px;
}

html.fenisa-brand .permission-approval {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 48px 30px;
}

html.fenisa-brand .permission-approval p {
  grid-column: 1 / -1;
}

html.fenisa-brand .permission-approval > div {
  min-height: 48px;
  justify-content: flex-end;
  border-top: 1px solid #555555;
  text-align: center;
}

html.fenisa-brand .payroll-vacation-permission-sheet footer {
  margin-top: 35px;
  padding-top: 10px;
  border-top: 1px solid var(--fenisa-border);
  color: var(--fenisa-muted);
  font-size: 11px;
  text-align: center;
}

@media (max-width: 991px) {
  html.fenisa-brand .payroll-vacations-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-vacations-summary {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .payroll-vacation-panel-heading {
    align-items: flex-start;
    padding: 15px;
  }

  html.fenisa-brand .payroll-vacation-filters .form-group {
    width: 100%;
    min-width: 0;
  }

  html.fenisa-brand .payroll-vacation-permission-sheet {
    padding: 22px 18px;
  }

  html.fenisa-brand .permission-grid {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .permission-full,
  html.fenisa-brand .permission-approval p {
    grid-column: auto;
  }

  html.fenisa-brand .permission-approval {
    grid-template-columns: 1fr;
  }
}

@media print {
  html.fenisa-brand body {
    background: #ffffff !important;
  }

  html.fenisa-brand .top-bar,
  html.fenisa-brand .left-bar,
  html.fenisa-brand .side-bar {
    display: none !important;
  }

  html.fenisa-brand .payroll-vacation-permission {
    max-width: none;
    margin: 0;
  }

  html.fenisa-brand .payroll-vacation-permission-sheet {
    padding: 0;
    border: 0;
  }

  html.fenisa-brand .payroll-vacation-permission-sheet section,
  html.fenisa-brand .payroll-vacation-permission-header {
    page-break-inside: avoid;
  }

  html.fenisa-brand .payroll-vacations-page .panel {
    border: 0;
    box-shadow: none;
  }

  html.fenisa-brand .payroll-vacations-header,
  html.fenisa-brand .payroll-vacations-notice,
  html.fenisa-brand .payroll-vacations-summary,
  html.fenisa-brand .payroll-vacation-request-panel,
  html.fenisa-brand .payroll-vacation-balance-panel {
    display: none !important;
  }

  html.fenisa-brand .payroll-vacations-page .panel-heading {
    padding-left: 0;
  }
}

html.fenisa-brand .table-responsive > .table {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  html.fenisa-brand,
  html.fenisa-brand body {
    max-width: 100%;
    overflow-x: hidden;
  }

  html.fenisa-brand .content,
  html.fenisa-brand .main-content,
  html.fenisa-brand .container-fluid {
    max-width: 100%;
  }

  html.fenisa-brand .content {
    padding-right: 12px;
    padding-left: 12px;
  }

  html.fenisa-brand .row {
    margin-right: -8px;
    margin-left: -8px;
  }

  html.fenisa-brand [class*="col-"] {
    min-width: 0;
  }

  html.fenisa-brand .panel {
    margin-bottom: 14px;
  }

  html.fenisa-brand .panel-heading {
    padding: 12px;
  }

  html.fenisa-brand .panel-heading h3,
  html.fenisa-brand .panel-title {
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  html.fenisa-brand .table-responsive,
  html.fenisa-brand .table_holder,
  html.fenisa-brand .dataTables_wrapper {
    width: 100%;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  html.fenisa-brand table.table:not(.stacktable) {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  html.fenisa-brand .table th,
  html.fenisa-brand .table td {
    vertical-align: middle;
  }

  html.fenisa-brand .table .btn,
  html.fenisa-brand .table button {
    margin: 2px;
  }

  html.fenisa-brand .btn-toolbar,
  html.fenisa-brand .panel-options,
  html.fenisa-brand .table_buttons,
  html.fenisa-brand .form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-width: 100%;
  }

  html.fenisa-brand .form-control,
  html.fenisa-brand select,
  html.fenisa-brand textarea,
  html.fenisa-brand .select2-container,
  html.fenisa-brand .selectize-control {
    max-width: 100%;
  }

  html.fenisa-brand .input-group {
    max-width: 100%;
  }

  html.fenisa-brand .modal-dialog {
    width: auto;
    max-width: calc(100% - 24px);
    margin: 12px;
  }

  html.fenisa-brand .modal-content {
    max-height: calc(100vh - 24px);
    overflow-y: auto;
  }

  html.fenisa-brand .pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  html.fenisa-brand .pagination > li {
    margin-bottom: 4px;
  }
}

  html.fenisa-brand .btn:not(.btn-default):not(.btn-link),
  html.fenisa-brand button,
  html.fenisa-brand input[type="button"],
  html.fenisa-brand input[type="submit"],
  html.fenisa-brand input[type="reset"],
  html.fenisa-brand .btn:not(.btn-default):not(.btn-link) *,
  html.fenisa-brand button *,
  html.fenisa-brand input[type="button"] *,
  html.fenisa-brand input[type="submit"] *,
  html.fenisa-brand input[type="reset"] * {
    color: #ffffff !important;
  }

  html.fenisa-brand .btn-default,
  html.fenisa-brand .btn-default *,
  html.fenisa-brand .btn-link,
  html.fenisa-brand .btn-link *,
  html.fenisa-brand .input-group-btn .btn,
  html.fenisa-brand .input-group-btn .btn * {
    color: #111111 !important;
  }

html.fenisa-brand .left-bar #mainMenu > li.payroll-menu > ul {
  padding: 4px 0 8px;
}

html.fenisa-brand .left-bar #mainMenu > li.payroll-menu > ul > li {
  padding: 0 4px !important;
}

html.fenisa-brand .left-bar #mainMenu > li.payroll-menu > ul > li > a {
  box-sizing: border-box;
  display: flex !important;
  align-items: center;
  gap: 6px;
  width: 100% !important;
  height: auto !important;
  min-height: 34px;
  padding: 7px 8px !important;
  overflow: visible !important;
  line-height: 1.3 !important;
  white-space: normal !important;
  text-overflow: clip !important;
  font-size: 13px;
  border-radius: 4px;
}

html.fenisa-brand .left-bar #mainMenu > li.payroll-menu > ul > li > a i {
  flex: 0 0 14px;
  width: 14px;
  margin: 0;
  padding: 0 !important;
  font-size: 12px !important;
  text-align: center;
}

html.fenisa-brand .left-bar #mainMenu > li.payroll-menu .payroll-menu-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
  line-height: 1.3;
}

html.fenisa-brand .left-bar #mainMenu > li.payroll-menu > ul > li.active_submenu_link > a,
html.fenisa-brand .left-bar #mainMenu > li.payroll-menu > ul > li > a:hover,
html.fenisa-brand .left-bar #mainMenu > li.payroll-menu > ul > li > a:focus {
  background: #292929 !important;
  color: #ffffff !important;
}

@media only screen and (min-width: 802px) and (max-width: 1366px) {
  html.fenisa-brand .wrapper.mini-bar .left-bar #mainMenu > li.payroll-menu > ul > li > a {
    display: block !important;
    width: 100% !important;
  }
}

html.fenisa-brand .payroll-monthly-page {
  display: grid;
  gap: 18px;
  margin-bottom: 24px;
}

html.fenisa-brand .payroll-monthly-header,
html.fenisa-brand .payroll-monthly-panel-heading {
  display: flex;
  align-items: center;
  gap: 16px;
}

html.fenisa-brand .payroll-monthly-header {
  justify-content: space-between;
  padding: 24px 28px;
  border-radius: 14px;
  background: linear-gradient(120deg, #122b45, #1b5878);
  color: #ffffff;
  box-shadow: 0 8px 22px rgba(18, 43, 69, 0.14);
}

html.fenisa-brand .payroll-monthly-header h2,
html.fenisa-brand .payroll-monthly-header p {
  margin: 5px 0 0;
  color: #ffffff;
}

html.fenisa-brand .payroll-monthly-header p {
  color: #e2edf4;
  max-width: 760px;
  opacity: 1;
}

html.fenisa-brand .payroll-monthly-eyebrow {
  color: #cfe5f1;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-monthly-header-icon {
  display: grid;
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 50%;
  color: #ffffff;
  font-size: 28px;
}

html.fenisa-brand .payroll-monthly-notice {
  padding: 14px 16px;
  border: 1px solid #f0d38c;
  border-left: 4px solid #d6a326;
  border-radius: 6px;
  background: #fff9e9;
  color: #493a16;
  line-height: 1.6;
}

html.fenisa-brand .payroll-monthly-notice a {
  color: #174f75;
  font-weight: 600;
  text-decoration: underline;
}

html.fenisa-brand .payroll-monthly-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

html.fenisa-brand .payroll-monthly-summary-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 6px;
  padding: 16px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  background: var(--fenisa-surface);
  box-shadow: var(--fenisa-shadow);
}

html.fenisa-brand .payroll-monthly-summary-card > span {
  color: #4e6275;
  font-size: 13px;
}

html.fenisa-brand .payroll-monthly-summary-card > strong {
  color: #18364f;
  font-size: 22px;
}

html.fenisa-brand .payroll-monthly-summary-card > small {
  color: #536679;
  line-height: 1.4;
}

html.fenisa-brand .payroll-monthly-summary-card.summary-net {
  border-color: #b9dfca;
  background: #f1faf5;
}

html.fenisa-brand .payroll-monthly-panel {
  overflow: hidden;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  box-shadow: var(--fenisa-shadow);
}

html.fenisa-brand .payroll-monthly-panel-heading {
  padding: 16px 20px;
  border-bottom: 1px solid var(--fenisa-border);
  background: #ffffff;
}

html.fenisa-brand .payroll-monthly-panel-heading h3,
html.fenisa-brand .payroll-monthly-panel-heading p {
  margin: 0;
}

html.fenisa-brand .payroll-monthly-panel-heading p {
  margin-top: 4px;
  color: #536679;
}

html.fenisa-brand .payroll-monthly-panel-heading .panel-heading-icon {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 8px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red);
  font-size: 20px;
}

html.fenisa-brand .payroll-monthly-panel-heading .panel-heading-icon.income {
  background: #eaf7ef;
  color: #21834a;
}

html.fenisa-brand .payroll-monthly-panel-heading .panel-heading-icon.history {
  background: #edf2ff;
  color: #4263a7;
}

html.fenisa-brand .payroll-period-selector {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 12px;
}

html.fenisa-brand .payroll-period-selector .form-group {
  min-width: 190px;
  margin: 0;
}

html.fenisa-brand .payroll-period-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid #d5e1e9;
  border-radius: 5px;
  background: #f1f6f9;
  color: #20394d;
}

html.fenisa-brand .payroll-period-state {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 9px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

html.fenisa-brand .payroll-period-state.is-preview {
  background: #fff2d6;
  color: #755000;
}

html.fenisa-brand .payroll-period-state.is-saved {
  background: #e4f3ea;
  color: #1c633d;
}

html.fenisa-brand .payroll-process-guide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

html.fenisa-brand .payroll-process-guide > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 11px 14px;
  border: 1px solid #dce5eb;
  border-radius: 8px;
  background: #ffffff;
}

html.fenisa-brand .payroll-process-guide > div > span {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  border-radius: 50%;
  background: #e7f0f6;
  color: #174f75;
  font-weight: 700;
}

html.fenisa-brand .payroll-process-guide p {
  margin: 0;
  color: #344f65;
  font-size: 12px;
  line-height: 1.4;
}

html.fenisa-brand .payroll-monthly-table {
  min-width: 1120px;
}

html.fenisa-brand .payroll-monthly-table > thead > tr > th,
html.fenisa-brand .payroll-monthly-table > tfoot > tr > th {
  white-space: nowrap;
  background: #f0f4f7;
  color: #30495e;
  font-size: 12px;
}

html.fenisa-brand .payroll-monthly-table > tbody > tr > td {
  color: #2d4052;
  vertical-align: middle;
}

html.fenisa-brand .payroll-monthly-table > tbody > tr > td strong {
  color: #18364f;
}

html.fenisa-brand .payroll-monthly-table > tbody > tr > td small {
  display: block;
  max-width: 210px;
  margin-top: 4px;
  color: #536679;
  font-size: 10px;
  line-height: 1.35;
}

html.fenisa-brand .payroll-monthly-table > tfoot > tr > th {
  border-top: 2px solid #9eafbc;
  background: #eaf0f4;
  color: #20394d;
}

html.fenisa-brand .payroll-preview-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
  margin-left: auto;
}

html.fenisa-brand .payroll-period-locked {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: #4d6071;
  font-size: 12px;
}

html.fenisa-brand .payroll-run-status {
  display: inline-block;
  padding: 4px 9px;
  border-radius: 16px;
  background: #fff2d6;
  color: #755000;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

html.fenisa-brand .payroll-run-status.status-approved {
  background: #eaf0fc;
  color: #31548c;
}

html.fenisa-brand .payroll-run-status.status-paid {
  background: #e4f3ea;
  color: #1c633d;
}

html.fenisa-brand .payroll-history-actions {
  min-width: 275px;
  white-space: normal;
}

html.fenisa-brand .payroll-history-actions .inline-form {
  margin: 3px 2px;
}

html.fenisa-brand .payroll-absence-form {
  padding-bottom: 8px;
}

html.fenisa-brand .payroll-absence-form .form-group {
  margin-bottom: 10px;
}

html.fenisa-brand .payroll-absence-table {
  min-width: 720px;
}

html.fenisa-brand.fenisa-dark .payroll-monthly-summary-card,
html.fenisa-brand.fenisa-dark .payroll-monthly-panel,
html.fenisa-brand.fenisa-dark .payroll-monthly-panel-heading,
html.fenisa-brand.fenisa-dark .payroll-monthly-panel .panel-body {
  border-color: #48434a;
  background: #27262a;
  color: #eee9ed;
}

html.fenisa-brand.fenisa-dark .payroll-monthly-summary-card > span,
html.fenisa-brand.fenisa-dark .payroll-monthly-summary-card > small,
html.fenisa-brand.fenisa-dark .payroll-monthly-panel-heading p,
html.fenisa-brand.fenisa-dark .payroll-monthly-panel .help-block,
html.fenisa-brand.fenisa-dark .payroll-monthly-table > tbody > tr > td,
html.fenisa-brand.fenisa-dark .payroll-monthly-table > tbody > tr > td small {
  color: #d5d0d5 !important;
}

html.fenisa-brand.fenisa-dark .payroll-monthly-summary-card > strong,
html.fenisa-brand.fenisa-dark .payroll-monthly-panel-heading h3,
html.fenisa-brand.fenisa-dark .payroll-monthly-table > tbody > tr > td strong {
  color: #fff !important;
}

html.fenisa-brand.fenisa-dark .payroll-monthly-summary-card.summary-net {
  border-color: #38634b;
  background: #20372b;
}

html.fenisa-brand.fenisa-dark .payroll-period-banner {
  border-color: #48434a;
  background: #302e33;
  color: #f0ecf1;
}

html.fenisa-brand.fenisa-dark .payroll-process-guide > div {
  border-color: #48434a;
  background: #27262a;
}

html.fenisa-brand.fenisa-dark .payroll-process-guide > div > span {
  background: #344a5b;
  color: #e8f3fb;
}

html.fenisa-brand.fenisa-dark .payroll-process-guide p {
  color: #e0dbe0;
}

html.fenisa-brand.fenisa-dark .payroll-monthly-table > thead > tr > th,
html.fenisa-brand.fenisa-dark .payroll-monthly-table > tfoot > tr > th {
  border-color: #48434a;
  background: #302e33;
  color: #f0ecf1 !important;
}

html.fenisa-brand .payroll-collaborators-page {
  margin: 0 auto 30px;
  max-width: 1480px;
}

html.fenisa-brand .payroll-collaborators-hero {
  align-items: center;
  background: linear-gradient(120deg, #122b45, #1b5878);
  border-radius: 15px;
  color: #fff;
  display: flex;
  gap: 20px;
  justify-content: space-between;
  margin: 0 0 18px;
  padding: 24px 28px;
}

html.fenisa-brand .payroll-collaborators-hero h2 {
  color: #fff !important;
  font-size: 26px;
  font-weight: 700;
  margin: 4px 0 5px;
}

html.fenisa-brand .payroll-collaborators-hero p {
  color: #e4edf4 !important;
  font-size: 13px;
  margin: 0;
  max-width: 680px;
}

html.fenisa-brand .payroll-collaborators-eyebrow {
  color: #d9e9f2 !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-collaborator-hero-actions,
html.fenisa-brand .payroll-collaborator-report-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

html.fenisa-brand .payroll-collaborator-hero-actions {
  justify-content: flex-end;
}

html.fenisa-brand .payroll-collaborator-hero-actions .btn-light {
  background: #fff !important;
  border: 1px solid #fff !important;
  color: #164260 !important;
  font-weight: 700;
}

html.fenisa-brand .payroll-collaborator-hero-actions .btn-outline-light {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.75) !important;
  color: #fff !important;
}

html.fenisa-brand .payroll-collaborator-summary {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 14px;
}

html.fenisa-brand .payroll-collaborator-metric {
  align-items: center;
  background: #fff;
  border: 1px solid #e1e8ee;
  border-radius: 11px;
  box-shadow: 0 3px 12px rgba(20,42,64,.045);
  display: flex;
  gap: 12px;
  min-width: 0;
  padding: 15px;
}

html.fenisa-brand .payroll-collaborator-metric-icon {
  align-items: center;
  background: #eaf2f7;
  border-radius: 10px;
  color: #195477;
  display: flex;
  flex: 0 0 42px;
  font-size: 19px;
  height: 42px;
  justify-content: center;
}

html.fenisa-brand .payroll-collaborator-metric-icon.active {
  background: #e5f4eb;
  color: #246d44;
}

html.fenisa-brand .payroll-collaborator-metric-icon.inactive {
  background: #f0f2f4;
  color: #536170;
}

html.fenisa-brand .payroll-collaborator-metric-icon.salary {
  background: #fff4dc;
  color: #775000;
}

html.fenisa-brand .payroll-collaborator-metric small,
html.fenisa-brand .payroll-collaborator-metric span:not(.payroll-collaborator-metric-icon) {
  color: #516477 !important;
  display: block;
  font-size: 10px;
  line-height: 1.35;
}

html.fenisa-brand .payroll-collaborator-metric strong {
  color: #18364f !important;
  display: block;
  font-size: 19px;
  line-height: 1.25;
  margin: 2px 0;
  overflow-wrap: anywhere;
}

html.fenisa-brand .payroll-collaborator-roster-chart,
html.fenisa-brand .payroll-collaborator-roster {
  background: #fff;
  border: 1px solid #e2e8ed;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(20,42,64,.045);
  margin-bottom: 16px;
  overflow: hidden;
}

html.fenisa-brand .payroll-collaborator-roster-chart {
  padding: 15px 19px;
}

html.fenisa-brand .payroll-collaborator-chart-heading {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 11px;
}

html.fenisa-brand .payroll-collaborator-chart-heading h3,
html.fenisa-brand .payroll-collaborator-roster-heading h3 {
  color: #18364f !important;
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 4px;
}

html.fenisa-brand .payroll-collaborator-chart-heading p,
html.fenisa-brand .payroll-collaborator-roster-heading p {
  color: #536679 !important;
  font-size: 11px;
  margin: 0;
}

html.fenisa-brand .payroll-collaborator-chart-heading > strong {
  color: #24445e !important;
  font-size: 18px;
}

html.fenisa-brand .payroll-collaborator-chart-track {
  background: #e7ecef;
  border-radius: 99px;
  display: flex;
  height: 10px;
  overflow: hidden;
}

html.fenisa-brand .payroll-collaborator-chart-active {
  background: #238052;
  transition: width .2s ease;
}

html.fenisa-brand .payroll-collaborator-chart-inactive {
  background: #9aa6b1;
  transition: width .2s ease;
}

html.fenisa-brand .payroll-collaborator-chart-legend {
  color: #43586b !important;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 9px;
}

html.fenisa-brand .payroll-collaborator-chart-legend > span {
  align-items: center;
  display: inline-flex;
  font-size: 11px;
  gap: 6px;
}

html.fenisa-brand .payroll-collaborator-chart-legend i {
  background: #238052;
  border-radius: 50%;
  height: 9px;
  width: 9px;
}

html.fenisa-brand .payroll-collaborator-chart-legend i.is-inactive {
  background: #9aa6b1;
}

html.fenisa-brand .payroll-collaborator-chart-legend strong {
  color: #18364f !important;
}

html.fenisa-brand .payroll-collaborator-roster-heading {
  align-items: center;
  border-bottom: 1px solid #e7edf1;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 17px 20px;
}

html.fenisa-brand .payroll-collaborator-filter-bar {
  background: #f7f9fb;
  border-bottom: 1px solid #e3e9ee;
  padding: 13px 20px;
}

html.fenisa-brand .payroll-collaborator-filters {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

html.fenisa-brand .payroll-collaborator-filters .form-group {
  margin: 0;
  min-width: 170px;
}

html.fenisa-brand .payroll-collaborator-filters .payroll-collaborator-search {
  flex: 1 1 360px;
}

html.fenisa-brand .payroll-collaborator-filters label {
  color: #263f55 !important;
  display: block;
  font-size: 11px;
  font-weight: 700;
  margin-bottom: 5px;
}

html.fenisa-brand .payroll-collaborator-search-input {
  position: relative;
}

html.fenisa-brand .payroll-collaborator-search-input i {
  color: #536b7f;
  left: 11px;
  position: absolute;
  top: 10px;
}

html.fenisa-brand .payroll-collaborator-search-input .form-control {
  padding-left: 33px;
}

html.fenisa-brand .payroll-collaborator-filters .form-control {
  background: #fff;
  border-color: #aebdca;
  color: #20374b !important;
  height: 38px;
}

html.fenisa-brand .payroll-collaborator-filter-actions {
  display: flex;
  gap: 7px;
}

html.fenisa-brand .payroll-collaborator-report-actions .btn {
  color: #29465e !important;
}

html.fenisa-brand .payroll-collaborator-table {
  margin-bottom: 0;
  min-width: 1040px;
}

html.fenisa-brand .payroll-collaborator-table > thead > tr > th,
html.fenisa-brand .payroll-collaborator-table > tfoot > tr > th {
  background: #f4f7f9;
  color: #30495e !important;
  font-size: 10px;
  letter-spacing: .02em;
  padding: 11px 12px;
  white-space: nowrap;
}

html.fenisa-brand .payroll-collaborator-table > tbody > tr > td {
  color: #2d4052 !important;
  padding: 12px;
  vertical-align: middle;
}

html.fenisa-brand .payroll-collaborator-table > tbody > tr > td strong {
  color: #1d354a !important;
}

html.fenisa-brand .payroll-collaborator-table > tbody > tr > td small {
  color: #516477 !important;
  display: block;
  font-size: 10px;
  margin-top: 3px;
}

html.fenisa-brand .payroll-collaborator-table > tfoot > tr > th {
  border-top: 2px solid #b9c8d3;
}

html.fenisa-brand .payroll-collaborator-table .btn-default {
  background: #f4f7f9 !important;
  border-color: #aebdca !important;
  color: #263f55 !important;
}

html.fenisa-brand .payroll-collaborator-empty {
  padding: 30px 20px;
}

html.fenisa-brand .payroll-collaborator-empty h4 {
  color: #203b52 !important;
}

html.fenisa-brand .payroll-collaborator-empty p {
  color: #536679 !important;
}

html.fenisa-brand .payroll-collaborator-form-page {
  margin: 0 auto 30px;
  max-width: 1160px;
}

html.fenisa-brand .payroll-form-intro {
  background: #fff;
  border: 1px solid #e2e8ed;
  border-radius: 12px;
  margin: 4px 0 16px;
  padding: 17px 19px;
}

html.fenisa-brand .payroll-form-eyebrow {
  color: #526a7e !important;
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  margin-bottom: 3px;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-form-intro h2 {
  color: #193750 !important;
  font-size: 23px;
  font-weight: 700;
}

html.fenisa-brand .payroll-form-intro p,
html.fenisa-brand .payroll-form-panel .panel-heading p {
  color: #516579 !important;
}

html.fenisa-brand .payroll-form-panel {
  border: 1px solid #e1e8ed;
  border-radius: 11px;
  box-shadow: 0 3px 12px rgba(20,42,64,.04);
}

html.fenisa-brand .payroll-form-panel > .panel-heading {
  background: #f7f9fb;
  border-bottom-color: #e1e8ed;
}

html.fenisa-brand .payroll-form-panel > .panel-heading h3 {
  color: #193750 !important;
  font-weight: 700;
}

html.fenisa-brand .payroll-form-panel label,
html.fenisa-brand .payroll-form-panel .checkbox-inline {
  color: #263f55 !important;
}

html.fenisa-brand .payroll-form-panel .help-block {
  color: #516579 !important;
}

html.fenisa-brand .payroll-form-panel .form-control {
  border-color: #aebdca;
  color: #20374b !important;
}

html.fenisa-brand .payroll-linked-account {
  background: #f1f7fb;
  border-color: #cbd9e2;
  color: #29465e !important;
}

html.fenisa-brand .payroll-status-pill.is-active {
  background: #e1f2e8;
  color: #1e6339 !important;
}

html.fenisa-brand .payroll-status-pill.is-inactive {
  background: #edf0f2;
  color: #465565 !important;
}

@media (max-width: 900px) {
  html.fenisa-brand .payroll-collaborator-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-collaborators-hero,
  html.fenisa-brand .payroll-collaborator-roster-heading {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px;
  }
  html.fenisa-brand .payroll-collaborator-hero-actions,
  html.fenisa-brand .payroll-collaborator-report-actions {
    justify-content: flex-start;
    width: 100%;
  }
  html.fenisa-brand .payroll-collaborator-summary {
    gap: 8px;
  }
  html.fenisa-brand .payroll-collaborator-metric {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding: 11px;
  }
  html.fenisa-brand .payroll-collaborator-metric strong {
    font-size: 16px;
  }
  html.fenisa-brand .payroll-collaborator-filters .form-group,
  html.fenisa-brand .payroll-collaborator-filters .payroll-collaborator-search {
    flex: 1 1 100%;
    min-width: 100%;
  }
  html.fenisa-brand .payroll-form-intro {
    align-items: flex-start;
    flex-wrap: wrap;
  }
}

@media print {
  html.fenisa-brand .payroll-collaborators-page {
    margin: 0;
    max-width: none;
  }
  html.fenisa-brand .payroll-collaborators-hero {
    background: #fff !important;
    border: 1px solid #8291a0;
    color: #111 !important;
    padding: 12px;
  }
  html.fenisa-brand .payroll-collaborators-hero h2,
  html.fenisa-brand .payroll-collaborators-hero p,
  html.fenisa-brand .payroll-collaborators-eyebrow {
    color: #111 !important;
  }
  html.fenisa-brand .payroll-collaborator-metric,
  html.fenisa-brand .payroll-collaborator-roster-chart,
  html.fenisa-brand .payroll-collaborator-roster {
    box-shadow: none;
  }
  html.fenisa-brand .payroll-collaborator-report-actions,
  html.fenisa-brand .payroll-collaborator-filter-bar,
  html.fenisa-brand .payroll-collaborator-table .hidden-print {
    display: none !important;
  }
  html.fenisa-brand .payroll-collaborator-table {
    min-width: 0;
    width: 100%;
  }
  html.fenisa-brand .payroll-collaborator-table th,
  html.fenisa-brand .payroll-collaborator-table td {
    color: #111 !important;
    font-size: 9px !important;
    padding: 5px !important;
  }
}

html.fenisa-brand .payroll-attendance-header h2,
html.fenisa-brand .payroll-overtime-header h2,
html.fenisa-brand .payroll-deductions-header h2,
html.fenisa-brand .payroll-vacations-header h2 {
  color: #18364f !important;
  font-weight: 700;
}

html.fenisa-brand .payroll-attendance-header p,
html.fenisa-brand .payroll-overtime-header p,
html.fenisa-brand .payroll-deductions-header p,
html.fenisa-brand .payroll-vacations-header p {
  color: #4b6074 !important;
}

html.fenisa-brand .payroll-attendance-page .panel-heading,
html.fenisa-brand .payroll-overtime-page .panel-heading,
html.fenisa-brand .payroll-deductions-page .panel-heading,
html.fenisa-brand .payroll-vacations-page .panel-heading {
  color: #193750 !important;
}

html.fenisa-brand .payroll-attendance-page .panel-heading h3,
html.fenisa-brand .payroll-overtime-page .panel-heading h3,
html.fenisa-brand .payroll-deductions-page .panel-heading h3,
html.fenisa-brand .payroll-vacations-page .panel-heading h3 {
  color: #193750 !important;
}

html.fenisa-brand .payroll-attendance-page .panel-heading p,
html.fenisa-brand .payroll-overtime-page .panel-heading p,
html.fenisa-brand .payroll-deductions-page .panel-heading p,
html.fenisa-brand .payroll-vacations-page .panel-heading p {
  color: #536679 !important;
}

html.fenisa-brand .payroll-attendance-page label,
html.fenisa-brand .payroll-overtime-page label,
html.fenisa-brand .payroll-deductions-page label,
html.fenisa-brand .payroll-vacations-page label {
  color: #263f55 !important;
}

html.fenisa-brand .payroll-attendance-page .form-control,
html.fenisa-brand .payroll-overtime-page .form-control,
html.fenisa-brand .payroll-deductions-page .form-control,
html.fenisa-brand .payroll-vacations-page .form-control {
  border-color: #aebdca;
  color: #20374b !important;
}

html.fenisa-brand .payroll-attendance-page .help-block,
html.fenisa-brand .payroll-overtime-page .help-block,
html.fenisa-brand .payroll-deductions-page .help-block,
html.fenisa-brand .payroll-vacations-page .help-block {
  color: #4b6074 !important;
}

html.fenisa-brand .payroll-attendance-page table thead th,
html.fenisa-brand .payroll-overtime-page table thead th,
html.fenisa-brand .payroll-deductions-page table thead th,
html.fenisa-brand .payroll-vacations-page table thead th,
html.fenisa-brand .payroll-monthly-page table thead th {
  color: #30495e !important;
}

html.fenisa-brand .payroll-attendance-page table tbody td,
html.fenisa-brand .payroll-overtime-page table tbody td,
html.fenisa-brand .payroll-deductions-page table tbody td,
html.fenisa-brand .payroll-vacations-page table tbody td,
html.fenisa-brand .payroll-monthly-page table tbody td {
  color: #2d4052 !important;
}

html.fenisa-brand .payroll-attendance-page table small,
html.fenisa-brand .payroll-overtime-page table small,
html.fenisa-brand .payroll-deductions-page table small,
html.fenisa-brand .payroll-vacations-page table small,
html.fenisa-brand .payroll-monthly-page table small {
  color: #506478 !important;
}

html.fenisa-brand .payroll-attendance-page {
  margin-bottom: 28px;
}

html.fenisa-brand .payroll-attendance-header {
  background: linear-gradient(120deg, #122b45, #1b5878);
  border-radius: 15px;
  color: #fff;
  margin: 0 0 16px;
  padding: 22px 27px;
}

html.fenisa-brand .payroll-attendance-header h2,
html.fenisa-brand .payroll-attendance-header p,
html.fenisa-brand .payroll-attendance-eyebrow {
  color: #fff !important;
}

html.fenisa-brand .payroll-attendance-header h2 {
  font-size: 25px;
  margin-top: 5px;
}

html.fenisa-brand .payroll-attendance-header p {
  color: #e2edf4 !important;
  max-width: 700px;
}

html.fenisa-brand .payroll-attendance-eyebrow {
  color: #d5e7f1 !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-attendance-header-icon {
  background: rgba(255,255,255,.14);
  color: #fff;
}

html.fenisa-brand .payroll-attendance-header-actions .btn-primary {
  background: #fff !important;
  border-color: #fff !important;
  font-weight: 700;
}

html.fenisa-brand .payroll-attendance-page .payroll-attendance-header-actions a.btn-primary,
html.fenisa-brand .payroll-attendance-page .payroll-attendance-header-actions a.btn-primary *,
html.fenisa-brand .payroll-attendance-page .payroll-attendance-header-actions a.btn-primary:hover,
html.fenisa-brand .payroll-attendance-page .payroll-attendance-header-actions a.btn-primary:hover * {
  color: #164260 !important;
}

html.fenisa-brand .payroll-attendance-summary {
  display: grid;
  gap: 11px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 15px;
}

html.fenisa-brand .payroll-attendance-metric {
  align-items: center;
  background: #fff;
  border: 1px solid #e1e8ee;
  border-radius: 11px;
  box-shadow: 0 3px 12px rgba(20,42,64,.045);
  display: flex;
  gap: 11px;
  min-width: 0;
  padding: 14px;
}

html.fenisa-brand .payroll-attendance-metric-icon {
  align-items: center;
  background: #eaf2f7;
  border-radius: 10px;
  color: #195477;
  display: flex;
  flex: 0 0 40px;
  font-size: 19px;
  height: 40px;
  justify-content: center;
}

html.fenisa-brand .payroll-attendance-metric-icon.hours {
  background: #e5f4eb;
  color: #246d44;
}

html.fenisa-brand .payroll-attendance-metric-icon.open {
  background: #fff4dc;
  color: #775000;
}

html.fenisa-brand .payroll-attendance-metric-icon.absences {
  background: #fbe9e8;
  color: #963c3d;
}

html.fenisa-brand .payroll-attendance-metric small,
html.fenisa-brand .payroll-attendance-metric span:not(.payroll-attendance-metric-icon) {
  color: #516477 !important;
  display: block;
  font-size: 10px;
  line-height: 1.35;
}

html.fenisa-brand .payroll-attendance-metric strong {
  color: #18364f !important;
  display: block;
  font-size: 19px;
  line-height: 1.25;
  margin: 2px 0;
  overflow-wrap: anywhere;
}

html.fenisa-brand .payroll-punch-card {
  background: linear-gradient(115deg, #f3f8fb, #fff);
  border: 1px solid #cfdee7;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(20,42,64,.045);
}

html.fenisa-brand .payroll-punch-card-icon {
  background: #e4f0f6;
  color: #195477;
}

html.fenisa-brand .payroll-punch-eyebrow {
  color: #255571 !important;
}

html.fenisa-brand .payroll-punch-card-info h3 {
  color: #173b54 !important;
}

html.fenisa-brand .payroll-punch-card-info p {
  color: #4d6275 !important;
}

html.fenisa-brand .payroll-punch-current-time {
  color: #2b4c63;
  font-size: 12px;
  font-weight: 600;
  margin-top: 9px;
}

html.fenisa-brand .payroll-punch-current-time i {
  color: #52768d;
  margin-right: 3px;
}

html.fenisa-brand .payroll-punch-form .form-control,
html.fenisa-brand .payroll-attendance-filters .form-control {
  border-color: #aebdca;
  color: #20374b !important;
  min-height: 38px;
}

html.fenisa-brand .payroll-punch-button {
  font-weight: 700;
  min-height: 42px;
  padding-left: 17px;
  padding-right: 17px;
}

html.fenisa-brand .payroll-attendance-history {
  border: 1px solid #e1e8ee;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(20,42,64,.045);
  overflow: hidden;
}

html.fenisa-brand .payroll-attendance-history-heading {
  align-items: center;
  background: #fff;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

html.fenisa-brand .payroll-attendance-history-heading h3 {
  color: #18364f !important;
  font-size: 17px;
  font-weight: 700;
}

html.fenisa-brand .payroll-attendance-history-heading p {
  color: #516477 !important;
}

html.fenisa-brand .payroll-attendance-report-actions,
html.fenisa-brand .payroll-attendance-filter-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

html.fenisa-brand .payroll-attendance-report-actions .btn-default,
html.fenisa-brand .payroll-attendance-filter-actions .btn-default {
  background: #fff !important;
  border-color: #aebdca !important;
  color: #29465e !important;
}

html.fenisa-brand .payroll-attendance-filters {
  align-items: flex-end;
  background: #f7f9fb;
  border-color: #e0e7ed;
  display: flex;
  margin-bottom: 16px;
}

html.fenisa-brand .payroll-attendance-filters label {
  color: #263f55 !important;
  font-size: 11px;
  font-weight: 700;
}

html.fenisa-brand .payroll-attendance-table {
  margin-bottom: 0;
  min-width: 900px;
}

html.fenisa-brand .payroll-attendance-table > thead > tr > th {
  background: #f4f7f9;
  color: #30495e !important;
  font-size: 10px;
  padding: 11px 10px;
  white-space: nowrap;
}

html.fenisa-brand .payroll-attendance-table > tbody > tr > td {
  color: #2d4052 !important;
  padding: 11px 10px;
  vertical-align: middle;
}

html.fenisa-brand .payroll-attendance-table > tbody > tr > td strong {
  color: #1d354a !important;
}

html.fenisa-brand .payroll-attendance-source {
  border-radius: 20px;
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 4px 8px;
  white-space: nowrap;
}

html.fenisa-brand .payroll-attendance-source.is-clock {
  background: #e7f2f8;
  color: #245571 !important;
}

html.fenisa-brand .payroll-attendance-source.is-manual {
  background: #f0eef8;
  color: #51447a !important;
}

html.fenisa-brand .payroll-attendance-empty h4 {
  color: #203b52 !important;
}

html.fenisa-brand .payroll-attendance-empty p,
html.fenisa-brand .payroll-attendance-footnote {
  color: #536679 !important;
}

@media (max-width: 900px) {
  html.fenisa-brand .payroll-attendance-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-attendance-header,
  html.fenisa-brand .payroll-attendance-history-heading {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px;
  }
  html.fenisa-brand .payroll-attendance-header-actions {
    align-items: center;
    flex-direction: row;
  }
  html.fenisa-brand .payroll-attendance-metric {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding: 11px;
  }
  html.fenisa-brand .payroll-attendance-metric strong {
    font-size: 16px;
  }
  html.fenisa-brand .payroll-attendance-report-actions {
    justify-content: flex-start;
  }
  html.fenisa-brand .payroll-punch-current-time {
    line-height: 1.8;
  }
}

@media print {
  html.fenisa-brand .payroll-attendance-page {
    margin: 0;
    max-width: none;
  }
  html.fenisa-brand .payroll-attendance-header {
    background: #fff !important;
    border: 1px solid #8291a0;
    padding: 10px;
  }
  html.fenisa-brand .payroll-attendance-header h2,
  html.fenisa-brand .payroll-attendance-header p,
  html.fenisa-brand .payroll-attendance-eyebrow {
    color: #111 !important;
  }
  html.fenisa-brand .payroll-attendance-header-actions,
  html.fenisa-brand .payroll-attendance-report-actions,
  html.fenisa-brand .payroll-attendance-filters,
  html.fenisa-brand .payroll-punch-card {
    display: none !important;
  }
  html.fenisa-brand .payroll-attendance-summary,
  html.fenisa-brand .payroll-attendance-history {
    box-shadow: none;
  }
  html.fenisa-brand .payroll-attendance-table {
    min-width: 0;
    width: 100%;
  }
  html.fenisa-brand .payroll-attendance-table th,
  html.fenisa-brand .payroll-attendance-table td {
    color: #111 !important;
    font-size: 9px !important;
    padding: 5px !important;
  }
}

html.fenisa-brand .payroll-benefits-page {
  margin: 0 auto 30px;
  max-width: 1480px;
}

html.fenisa-brand .payroll-benefits-page [hidden] {
  display: none !important;
}

html.fenisa-brand .payroll-benefits-header {
  align-items: center;
  background: linear-gradient(120deg, #122b45, #1d5278);
  border-radius: 16px;
  color: #fff;
  display: flex;
  justify-content: space-between;
  margin-bottom: 18px;
  padding: 25px 30px;
}

html.fenisa-brand .payroll-benefits-header h2,
html.fenisa-brand .payroll-benefits-header p {
  color: #fff !important;
  margin: 4px 0 0;
}

html.fenisa-brand .payroll-benefits-header p {
  font-size: 14px !important;
  max-width: 760px;
  opacity: 1;
}

html.fenisa-brand .payroll-benefits-eyebrow {
  color: #dcecf7 !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  opacity: .75;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-benefits-header h2 {
  font-size: 25px !important;
  font-weight: 700;
  line-height: 1.25;
}

html.fenisa-brand .payroll-benefits-header-icon {
  align-items: center;
  background: rgba(255,255,255,.13);
  border-radius: 14px;
  color: #fff !important;
  display: flex;
  font-size: 28px;
  height: 58px;
  justify-content: center;
  width: 58px;
}

html.fenisa-brand .payroll-benefits-notice {
  align-items: flex-start;
  background: #fff8e8;
  border: 1px solid #f1dfa8;
  border-radius: 10px;
  color: #60460d !important;
  display: flex;
  gap: 10px;
  margin-bottom: 18px;
  padding: 13px 16px;
}

html.fenisa-brand .payroll-benefits-notice i {
  font-size: 18px;
  margin-top: 1px;
}

html.fenisa-brand .payroll-benefits-notice p {
  margin: 0;
}

html.fenisa-brand .payroll-benefit-panel {
  border: 1px solid #e8edf2;
  border-radius: 12px;
  box-shadow: 0 5px 18px rgba(20,42,64,.05);
  margin-bottom: 18px;
  overflow: hidden;
}

html.fenisa-brand .payroll-benefit-panel > .panel-heading {
  background: #fff;
  border-bottom: 1px solid #edf0f3;
  padding: 17px 20px;
}

html.fenisa-brand .payroll-benefit-panel > .panel-heading h3 {
  color: #17344e !important;
  font-size: 17px;
  font-weight: 700;
  margin: 0;
}

html.fenisa-brand .payroll-benefit-panel > .panel-heading p {
  color: #536577 !important;
  font-size: 12px;
  margin: 5px 0 0;
}

html.fenisa-brand .payroll-benefit-panel .panel-heading {
  color: #17344e !important;
}

html.fenisa-brand .payroll-benefit-panel .panel-heading p {
  font-size: 12px !important;
}

html.fenisa-brand .payroll-benefit-panel .panel-body {
  padding: 20px;
}

html.fenisa-brand .payroll-benefit-panel label {
  color: #243b50 !important;
  font-size: 12px;
  font-weight: 700;
}

html.fenisa-brand .payroll-benefits-page .form-control {
  background-color: #fff;
  border-color: #aebdca;
  color: #20364a !important;
}

html.fenisa-brand .payroll-benefits-page .form-control:focus {
  border-color: #2475a8;
  box-shadow: 0 0 0 2px rgba(36,117,168,.16);
}

html.fenisa-brand .payroll-benefits-page .help-block,
html.fenisa-brand .payroll-benefits-page small {
  color: #4b5e70 !important;
  font-size: 11px;
  line-height: 1.5;
}

html.fenisa-brand .payroll-benefits-page .btn-primary {
  background: #145a82 !important;
  border-color: #145a82 !important;
  color: #fff !important;
}

html.fenisa-brand .payroll-benefits-page .btn-default {
  background: #f3f6f8 !important;
  border-color: #9eafbc !important;
  color: #253c50 !important;
}

html.fenisa-brand .payroll-benefits-page .btn-danger {
  background: #a82f37 !important;
  border-color: #962932 !important;
  color: #fff !important;
}

html.fenisa-brand .payroll-benefit-form-note {
  align-items: flex-start;
  background: #f1f7fb;
  border-radius: 8px;
  color: #30485e !important;
  display: flex;
  font-size: 11px;
  gap: 8px;
  margin: 14px 0;
  padding: 11px;
}

html.fenisa-brand .payroll-benefit-form-note i {
  color: #3182a8;
  font-size: 15px;
}

html.fenisa-brand .payroll-benefit-termination-notice {
  align-items: flex-start;
  background: #fff1f0;
  border: 1px solid #efc4c0;
  border-radius: 8px;
  color: #7d242b !important;
  display: flex;
  font-size: 11px;
  gap: 8px;
  line-height: 1.45;
  margin: 12px 0;
  padding: 10px;
}

html.fenisa-brand .payroll-benefit-preview {
  background: #f5f9fc;
  border: 1px solid #b8cbd9;
  border-left: 4px solid #17648f;
  border-radius: 9px;
  color: #20364a !important;
  margin: 15px 0;
  padding: 14px;
}

html.fenisa-brand .payroll-benefit-preview-heading {
  color: #173b56 !important;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

html.fenisa-brand .payroll-benefit-preview-heading strong {
  font-size: 15px;
}

html.fenisa-brand .payroll-benefit-preview-heading span,
html.fenisa-brand .payroll-benefit-preview-meta,
html.fenisa-brand .payroll-benefit-preview-note {
  color: #3d5265 !important;
  font-size: 11px;
  line-height: 1.5;
}

html.fenisa-brand .payroll-benefit-preview-meta {
  border-bottom: 1px solid #d9e3ea;
  margin-top: 8px;
  padding-bottom: 8px;
}

html.fenisa-brand .payroll-benefit-preview-table {
  margin: 7px 0 0;
}

html.fenisa-brand .payroll-benefit-preview-table > tbody > tr > td {
  border-top: 1px solid #e1e8ed;
  color: #263d51 !important;
  font-size: 12px;
  padding: 7px 4px;
}

html.fenisa-brand .payroll-benefit-preview-total {
  align-items: center;
  border-top: 2px solid #b4c6d3;
  color: #163a53 !important;
  display: flex;
  font-size: 13px;
  font-weight: 700;
  justify-content: space-between;
  padding-top: 9px;
}

html.fenisa-brand .payroll-benefit-preview-total strong {
  color: #0d5c4a !important;
  font-size: 19px;
}

html.fenisa-brand .payroll-benefit-preview-note {
  background: #fff8e8;
  border-radius: 6px;
  color: #694d10 !important;
  margin: 9px 0 0;
  padding: 7px 9px;
}

html.fenisa-brand .payroll-benefit-preview-error {
  background: #fff1f0;
  border: 1px solid #efc4c0;
  border-radius: 7px;
  color: #8b232c !important;
  font-size: 12px;
  margin: 12px 0;
  padding: 10px;
}

html.fenisa-brand .payroll-benefit-filters {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

html.fenisa-brand .payroll-benefit-filters .form-group {
  flex: 1 1 125px;
  margin: 0;
  min-width: 120px;
}

html.fenisa-brand .payroll-benefit-filters .payroll-benefit-filter-actions {
  flex: 1 1 100%;
  margin-top: 4px;
}

html.fenisa-brand .payroll-benefit-table {
  margin: 0;
}

html.fenisa-brand .payroll-benefit-table th {
  background: #f7f9fb;
  color: #314a60 !important;
  font-size: 11px;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-benefit-table td {
  vertical-align: middle;
}

html.fenisa-brand .payroll-benefit-table td small {
  color: #526579 !important;
  display: block;
  margin-top: 3px;
}

html.fenisa-brand .payroll-benefit-actions {
  min-width: 250px;
  white-space: nowrap;
}

html.fenisa-brand .payroll-benefit-actions .inline-form {
  display: inline-block;
  margin: 2px 0;
}

html.fenisa-brand .payroll-benefit-status {
  background: #fff0c7;
  border-radius: 20px;
  color: #684700;
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 9px;
}

html.fenisa-brand .payroll-benefit-status.status-paid {
  background: #e6f6ed;
  color: #25734b;
}

html.fenisa-brand .payroll-benefit-empty {
  color: #4d6072 !important;
  padding: 24px !important;
  text-align: center;
}

html.fenisa-brand .payroll-benefit-report {
  margin: 0 auto 30px;
  max-width: 1020px;
}

html.fenisa-brand .payroll-benefit-report-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-bottom: 14px;
}

html.fenisa-brand .payroll-benefit-report-paper {
  background: #fff;
  border: 1px solid #e4e9ee;
  border-radius: 12px;
  box-shadow: 0 8px 28px rgba(20,42,64,.08);
  padding: 35px 42px;
}

html.fenisa-brand .payroll-benefit-report-header {
  align-items: flex-start;
  border-bottom: 2px solid #1d5278;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}

html.fenisa-brand .payroll-benefit-report-brand {
  align-items: center;
  display: flex;
  gap: 15px;
}

html.fenisa-brand .payroll-benefit-report-brand img {
  max-height: 64px;
  max-width: 150px;
  object-fit: contain;
}

html.fenisa-brand .payroll-benefit-report-brand h1 {
  color: #17344e;
  font-size: 21px;
  font-weight: 700;
  margin: 0 0 5px;
}

html.fenisa-brand .payroll-benefit-report-brand small,
html.fenisa-brand .payroll-benefit-report-title span {
  color: #465a6d !important;
}

html.fenisa-brand .payroll-benefit-report-title {
  text-align: right;
}

html.fenisa-brand .payroll-benefit-report-title h2 {
  color: #17344e;
  font-size: 20px;
  margin: 5px 0;
}

html.fenisa-brand .payroll-benefit-report-employee {
  background: #f5f8fa;
  border-radius: 9px;
  display: grid;
  gap: 15px 22px;
  grid-template-columns: repeat(3, 1fr);
  margin: 22px 0;
  padding: 17px;
}

html.fenisa-brand .payroll-benefit-report-employee span {
  color: #728090;
  display: block;
  font-size: 10px;
  margin-bottom: 4px;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-benefit-report-employee strong {
  color: #233b52;
  font-size: 13px;
}

html.fenisa-brand .payroll-benefit-report-section-heading {
  align-items: baseline;
  display: flex;
  justify-content: space-between;
  margin: 20px 0 10px;
}

html.fenisa-brand .payroll-benefit-report-section-heading h3 {
  color: #18344f;
  font-size: 16px;
  font-weight: 700;
  margin: 0;
}

html.fenisa-brand .payroll-benefit-report-section-heading p {
  color: #4e6072;
  margin: 0;
}

html.fenisa-brand .payroll-benefit-report-table > thead > tr > th,
html.fenisa-brand .payroll-benefit-report-table > tfoot > tr > th {
  background: #f5f8fa;
  color: #3b5064;
}

html.fenisa-brand .payroll-benefit-report-table td small {
  color: #788694;
  display: block;
  margin-top: 3px;
}

html.fenisa-brand .payroll-benefit-report-table tfoot th {
  border-top: 2px solid #ced8e0;
  font-size: 15px;
  padding-top: 13px;
}

html.fenisa-brand .payroll-benefit-report-basis,
html.fenisa-brand .payroll-benefit-report-footer {
  color: #677687;
  font-size: 11px;
}

html.fenisa-brand .payroll-benefit-report-audit {
  border-top: 1px solid #e7ebef;
  margin-top: 24px;
  padding-top: 15px;
}

html.fenisa-brand .payroll-benefit-report-audit h3 {
  color: #18344f;
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 8px;
}

html.fenisa-brand .payroll-benefit-report-audit p {
  color: #566778;
  font-size: 11px;
  margin: 3px 0;
}

html.fenisa-brand .payroll-benefit-report-footer {
  border-top: 1px solid #e7ebef;
  margin-top: 16px;
  padding-top: 12px;
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-benefits-header {
  	padding: 20px;
  }
  html.fenisa-brand .payroll-benefits-header-icon {
  	display: none;
  }
  html.fenisa-brand .payroll-benefit-report-paper {
  	padding: 22px 18px;
  }
  html.fenisa-brand .payroll-benefit-report-header {
  	display: block;
  }
  html.fenisa-brand .payroll-benefit-report-title {
  	margin-top: 18px;
  	text-align: left;
  }
  html.fenisa-brand .payroll-benefit-report-employee {
  	grid-template-columns: repeat(2, 1fr);
  }
}

@media print {
  html.fenisa-brand .payroll-benefit-report {
  	margin: 0;
  	max-width: none;
  }
  html.fenisa-brand .payroll-benefit-report-paper {
  	border: 0;
  	border-radius: 0;
  	box-shadow: none;
  	padding: 0;
  }
  html.fenisa-brand .payroll-benefit-report-employee {
  	-webkit-print-color-adjust: exact;
  	print-color-adjust: exact;
  }
}

html.fenisa-brand .payroll-monthly-table td small {
  display: block;
  max-width: 150px;
  margin-top: 4px;
  color: var(--fenisa-muted);
  font-size: 11px;
  white-space: normal;
}

html.fenisa-brand .fenisa-timeclock-page {
  max-width: 1380px;
  width: 100%;
  margin: 24px auto 32px;
}

html.fenisa-brand .fenisa-timeclock-card {
  padding: 32px 36px;
}

html.fenisa-brand .fenisa-timeclock-card-top {
  padding-bottom: 25px;
}

html.fenisa-brand .fenisa-timeclock-live {
  min-width: 230px;
  padding: 12px 18px;
  border: 1px solid #dce7ee;
  border-radius: 11px;
  background: #f5f9fb;
}

html.fenisa-brand .fenisa-timeclock-live strong {
  color: #163a53 !important;
  font-size: 30px;
  letter-spacing: .01em;
}

html.fenisa-brand .fenisa-timeclock-live span,
html.fenisa-brand .fenisa-timeclock-live small {
  color: #50677a !important;
}

html.fenisa-brand .fenisa-timeclock-main {
  min-height: 100px;
  margin: 20px 0;
  border-color: #dce5eb;
  background: #f7f9fb;
}

html.fenisa-brand .fenisa-timeclock-employee strong {
  color: #18364f !important;
  font-size: 17px;
}

html.fenisa-brand .fenisa-timeclock-employee span,
html.fenisa-brand .fenisa-timeclock-employee small,
html.fenisa-brand .fenisa-timeclock-status small {
  color: #506478 !important;
}

html.fenisa-brand .fenisa-timeclock-status {
  max-width: 48%;
  padding: 12px 16px;
  border: 1px solid #dce7ee;
  border-radius: 9px;
  background: #fff;
}

html.fenisa-brand .fenisa-timeclock-card.is-clocked-in .fenisa-timeclock-status {
  border-color: #cde7d7;
  background: #f4fbf6;
}

html.fenisa-brand .fenisa-timeclock-comment textarea {
  min-height: 88px;
  border-color: #aebdca;
  color: #20374b !important;
}

html.fenisa-brand .fenisa-timeclock-comment label {
  color: #263f55 !important;
}

html.fenisa-brand .fenisa-timeclock-primary,
html.fenisa-brand .fenisa-timeclock-secondary {
  min-height: 48px;
}

html.fenisa-brand .fenisa-timeclock-card .fenisa-timeclock-primary {
  min-width: 205px;
}

html.fenisa-brand .fenisa-timeclock-card .btn-primary.fenisa-timeclock-primary {
  background: #17613f !important;
  border-color: #17613f !important;
}

html.fenisa-brand .fenisa-timeclock-card .btn-primary.fenisa-timeclock-primary:hover {
  background: #104e32 !important;
  border-color: #104e32 !important;
}

html.fenisa-brand .fenisa-timeclock-card .fenisa-timeclock-secondary {
  border-color: #9eacb8 !important;
  color: #29465e !important;
}

html.fenisa-brand .fenisa-timeclock-card .fenisa-timeclock-secondary *,
html.fenisa-brand .fenisa-timeclock-card .fenisa-timeclock-completed .btn-default,
html.fenisa-brand .fenisa-timeclock-card .fenisa-timeclock-completed .btn-default * {
  color: #29465e !important;
}

html.fenisa-brand .fenisa-timeclock-footer-links {
  border-top-color: #e1e8ed;
}

html.fenisa-brand .fenisa-timeclock-text-link {
  color: #174e70 !important;
}

html.fenisa-brand .payroll-overtime-page {
  margin-bottom: 30px;
}

html.fenisa-brand .payroll-overtime-header {
  align-items: center;
  background: linear-gradient(120deg, #122b45, #1b5878);
  border-radius: 14px;
  color: #fff;
  margin: 0 0 15px;
  padding: 21px 25px;
}

html.fenisa-brand .payroll-overtime-header h2,
html.fenisa-brand .payroll-overtime-header p {
  color: #fff !important;
}

html.fenisa-brand .payroll-overtime-header h2 {
  font-size: 24px;
  font-weight: 700;
}

html.fenisa-brand .payroll-overtime-header p {
  color: #e1edf4 !important;
}

html.fenisa-brand .payroll-overtime-header-icon {
  background: rgba(255,255,255,.14);
  color: #fff;
}

html.fenisa-brand .payroll-overtime-workflow {
  background: #fff;
  border: 1px solid #dce5eb;
  border-radius: 11px;
  box-shadow: 0 3px 12px rgba(20,42,64,.04);
  margin-bottom: 14px;
  padding: 15px 18px;
}

html.fenisa-brand .payroll-overtime-workflow-heading {
  align-items: center;
  display: flex;
  gap: 10px;
  margin-bottom: 13px;
}

html.fenisa-brand .payroll-overtime-workflow-icon {
  align-items: center;
  background: #eaf2f7;
  border-radius: 9px;
  color: #195477;
  display: inline-flex;
  flex: 0 0 38px;
  font-size: 19px;
  height: 38px;
  justify-content: center;
}

html.fenisa-brand .payroll-overtime-workflow-heading h3 {
  color: #18364f !important;
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 3px;
}

html.fenisa-brand .payroll-overtime-workflow-heading p {
  color: #506478 !important;
  font-size: 11px;
  margin: 0;
}

html.fenisa-brand .payroll-overtime-steps {
  counter-reset: overtime-step;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}

html.fenisa-brand .payroll-overtime-steps li {
  align-items: flex-start;
  background: #f7f9fb;
  border: 1px solid #e4ebf0;
  border-radius: 8px;
  display: flex;
  gap: 9px;
  min-width: 0;
  padding: 10px;
}

html.fenisa-brand .payroll-overtime-steps li > span {
  align-items: center;
  background: #1b5878;
  border-radius: 50%;
  color: #fff !important;
  display: inline-flex;
  flex: 0 0 24px;
  font-size: 11px;
  font-weight: 700;
  height: 24px;
  justify-content: center;
}

html.fenisa-brand .payroll-overtime-steps strong {
  color: #203b52 !important;
  display: block;
  font-size: 11px;
  line-height: 1.4;
}

html.fenisa-brand .payroll-overtime-steps p {
  color: #506478 !important;
  font-size: 10px;
  line-height: 1.45;
  margin: 4px 0 0;
}

html.fenisa-brand .payroll-overtime-legal-note {
  background: #fff9e9;
  border-color: #eadfbf;
  border-radius: 9px;
  color: #584712 !important;
  line-height: 1.55;
  margin-bottom: 13px;
  padding: 10px 14px;
}

html.fenisa-brand .payroll-overtime-summary {
  gap: 11px;
  margin-bottom: 14px;
}

html.fenisa-brand .payroll-overtime-summary-card {
  border-color: #e0e7ed;
  border-radius: 10px;
  min-height: 76px;
  padding: 13px 15px;
}

html.fenisa-brand .payroll-overtime-summary-card strong {
  color: #18364f !important;
}

html.fenisa-brand .payroll-overtime-summary-card span {
  color: #506478 !important;
}

html.fenisa-brand .payroll-overtime-request-panel,
html.fenisa-brand .payroll-overtime-history {
  border: 1px solid #e0e7ed;
  border-radius: 11px;
  box-shadow: 0 4px 15px rgba(20,42,64,.045);
}

html.fenisa-brand .payroll-overtime-panel-heading,
html.fenisa-brand .payroll-overtime-history-heading {
  background: #f8fafb;
  border-bottom-color: #e1e8ed;
}

html.fenisa-brand .payroll-overtime-panel-heading h3,
html.fenisa-brand .payroll-overtime-history-heading h3 {
  color: #18364f !important;
  font-weight: 700;
}

html.fenisa-brand .payroll-overtime-panel-heading p,
html.fenisa-brand .payroll-overtime-history-heading p {
  color: #506478 !important;
}

html.fenisa-brand .payroll-overtime-requester {
  background: #f6f9fb;
  border-color: #dce5eb;
  color: #29465e !important;
  margin-bottom: 12px;
}

html.fenisa-brand .payroll-overtime-requester span {
  color: #52687a !important;
}

html.fenisa-brand .payroll-overtime-requester strong {
  color: #1d3b54 !important;
}

html.fenisa-brand .payroll-overtime-measurement-note {
  background: #f3f7fa;
  border-left: 3px solid #4d7994;
  border-radius: 4px;
  color: #43596c !important;
  font-size: 11px;
  line-height: 1.5;
  margin: 0 0 16px;
  padding: 9px 11px;
}

html.fenisa-brand .payroll-overtime-form .form-control {
  border-color: #aebdca;
  color: #20374b !important;
  min-height: 39px;
}

html.fenisa-brand .payroll-overtime-form label {
  color: #263f55 !important;
  font-size: 11px;
  font-weight: 700;
}

html.fenisa-brand .payroll-overtime-form .help-block {
  color: #506478 !important;
}

html.fenisa-brand .payroll-overtime-submit .btn {
  min-height: 40px;
  padding-left: 15px;
  padding-right: 15px;
}

html.fenisa-brand .payroll-overtime-empty-eligibility,
html.fenisa-brand .payroll-overtime-empty {
  background: #f8fafb;
  border: 1px dashed #cbd7df;
  border-radius: 9px;
  margin: 0;
  padding: 18px 14px;
}

html.fenisa-brand .payroll-overtime-empty-eligibility > i,
html.fenisa-brand .payroll-overtime-empty .payroll-empty-icon {
  color: #2d6a4c !important;
}

html.fenisa-brand .payroll-overtime-empty-eligibility strong,
html.fenisa-brand .payroll-overtime-empty h4 {
  color: #18364f !important;
}

html.fenisa-brand .payroll-overtime-empty-eligibility p,
html.fenisa-brand .payroll-overtime-empty p {
  color: #506478 !important;
  margin-bottom: 10px;
}

html.fenisa-brand .payroll-overtime-next-step {
  background: #eef5f9;
  border: 1px solid #d3e1e9;
  border-radius: 7px;
  color: #294b62 !important;
  font-size: 11px;
  line-height: 1.5;
  margin: 0 auto 12px;
  max-width: 650px;
  padding: 9px 11px;
}

html.fenisa-brand .payroll-overtime-next-step i {
  color: #1b5878;
  margin-right: 4px;
}

html.fenisa-brand .payroll-overtime-empty-eligibility .btn-default {
  background: #fff !important;
  border-color: #aebdca !important;
  color: #29465e !important;
}

html.fenisa-brand .payroll-overtime-table {
  margin-bottom: 0;
  min-width: 850px;
}

html.fenisa-brand .payroll-overtime-form {
  grid-template-columns: minmax(190px, 1fr) minmax(145px, .8fr) minmax(145px, .7fr) minmax(190px, 1.1fr) auto;
}

html.fenisa-brand .payroll-overtime-form .overtime-employee-field,
html.fenisa-brand .payroll-overtime-form .overtime-date-field,
html.fenisa-brand .payroll-overtime-form .overtime-hours-field,
html.fenisa-brand .payroll-overtime-form .overtime-note-field {
  min-width: 0;
}

html.fenisa-brand .payroll-overtime-form .overtime-hours-field .input-group {
  width: 100%;
}

html.fenisa-brand .payroll-overtime-form .overtime-hours-field .help-block {
  line-height: 1.35;
  min-height: 0;
}

@media (max-width: 991px) {
  html.fenisa-brand .payroll-overtime-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-overtime-form {
    grid-template-columns: 1fr;
  }
}

html.fenisa-brand .payroll-overtime-table thead th {
  background: #f4f7f9;
  color: #30495e !important;
  font-size: 10px;
  padding: 10px;
}

html.fenisa-brand .payroll-overtime-table tbody td {
  color: #2d4052 !important;
  padding: 10px;
}

html.fenisa-brand .payroll-overtime-reviewer {
  color: #506478 !important;
}

html.fenisa-brand .payroll-overtime-review-actions .btn-success {
  background: #17613f !important;
  border-color: #17613f !important;
}

html.fenisa-brand .payroll-overtime-review-actions .btn-default {
  background: #fff !important;
  border-color: #aebdca !important;
  color: #29465e !important;
}

@media (max-width: 767px) {
  html.fenisa-brand .fenisa-timeclock-page {
    margin-top: 12px;
  }
  html.fenisa-brand .fenisa-timeclock-card {
    padding: 22px 18px;
  }
  html.fenisa-brand .fenisa-timeclock-live {
    align-items: flex-start;
    min-width: 0;
    padding: 10px 13px;
    width: 100%;
  }
  html.fenisa-brand .fenisa-timeclock-live strong {
    font-size: 26px;
  }
  html.fenisa-brand .fenisa-timeclock-status {
    max-width: none;
    width: 100%;
  }
  html.fenisa-brand .payroll-overtime-steps {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .payroll-overtime-workflow {
    padding: 13px;
  }

  html.fenisa-brand .payroll-overtime-header {
    padding: 18px;
  }
}

html.fenisa-brand .payroll-period-locked {
  margin-left: auto;
  color: #6d5717;
  font-size: 13px;
}

html.fenisa-brand .payroll-period-locked a {
  margin-left: 5px;
  font-weight: 600;
}

html.fenisa-brand .payroll-income-form {
  padding-bottom: 8px;
}

html.fenisa-brand .payroll-income-form .form-group {
  margin-bottom: 10px;
}

html.fenisa-brand .payroll-earnings-table {
  margin-top: 12px;
}

@media (max-width: 991px) {
  html.fenisa-brand .payroll-monthly-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-monthly-header {
    padding: 18px;
  }

  html.fenisa-brand .payroll-monthly-header-icon {
    display: none;
  }

  html.fenisa-brand .payroll-monthly-summary {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  html.fenisa-brand .payroll-monthly-summary-card {
    padding: 12px;
  }

  html.fenisa-brand .payroll-monthly-summary-card > strong {
    font-size: 18px;
  }

  html.fenisa-brand .payroll-monthly-panel-heading {
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 13px;
  }

  html.fenisa-brand .payroll-period-selector {
    align-items: stretch;
    flex-direction: column;
  }

  html.fenisa-brand .payroll-period-selector .form-group {
    min-width: 0;
  }

  html.fenisa-brand .payroll-period-locked {
    margin-left: 0;
  }
}

@media print {
  html.fenisa-brand .payroll-monthly-header {
    padding: 12px;
    border: 1px solid #999999;
    background: #ffffff !important;
    color: #111111;
  }

  html.fenisa-brand .payroll-monthly-header h2,
  html.fenisa-brand .payroll-monthly-header p {
    color: #111111;
  }

  html.fenisa-brand .payroll-monthly-summary-card,
  html.fenisa-brand .payroll-monthly-panel {
    box-shadow: none;
  }

  html.fenisa-brand .payroll-period-selector,
  html.fenisa-brand .payroll-income-panel,
  html.fenisa-brand .payroll-monthly-panel:last-child {
    display: none !important;
  }

  html.fenisa-brand .payroll-monthly-table {
    min-width: 0;
    font-size: 9px;
  }

  html.fenisa-brand .payroll-monthly-table td small {
    max-width: none;
  }
}

html.fenisa-brand .payroll-run-document-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

html.fenisa-brand .payroll-document-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

html.fenisa-brand .payroll-run-audit {
  margin-bottom: 20px;
  padding: 16px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  background: #f8f9fb;
}

html.fenisa-brand .payroll-run-audit h5 {
  margin: 0 0 12px;
}

html.fenisa-brand .payroll-run-audit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

html.fenisa-brand .payroll-run-audit-grid > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

html.fenisa-brand .payroll-run-audit-grid span,
html.fenisa-brand .payroll-run-audit-grid small {
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-run-audit-grid strong {
  overflow-wrap: anywhere;
}

html.fenisa-brand .payroll-run-audit > p {
  margin: 12px 0 0;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-history-actions {
  min-width: 230px;
  white-space: nowrap;
}

html.fenisa-brand .payroll-history-actions .inline-form {
  display: inline-block;
  margin: 2px 0;
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-run-document-heading {
    flex-direction: column;
  }

  html.fenisa-brand .payroll-document-actions {
    width: 100%;
  }

  html.fenisa-brand .payroll-run-audit-grid {
    grid-template-columns: 1fr;
  }
}

@media print {
  html.fenisa-brand .payroll-run-document {
    border: 0;
    box-shadow: none;
  }

  html.fenisa-brand .payroll-run-document .panel-heading {
    padding-right: 0;
    padding-left: 0;
    border-bottom: 1px solid #999999;
  }

  html.fenisa-brand .payroll-run-audit {
    padding: 10px;
    background: #ffffff !important;
  }

  html.fenisa-brand .payroll-run-details-table {
    width: 100%;
    font-size: 9px;
  }

  html.fenisa-brand .payroll-run-details-table th,
  html.fenisa-brand .payroll-run-details-table td {
    padding: 4px !important;
  }
}

html.fenisa-brand .payroll-run-document {
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

html.fenisa-brand .payroll-document-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}

html.fenisa-brand .payroll-document-paper {
  max-width: 1440px;
  margin: 0 auto 28px;
  padding: 34px 38px;
  border: 1px solid #e1e3e8;
  border-top: 5px solid var(--fenisa-red);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 12px 36px rgba(32, 32, 35, 0.08);
}

html.fenisa-brand .payroll-document-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 22px;
  border-bottom: 1px solid #e4e5e8;
}

html.fenisa-brand .payroll-document-company {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

html.fenisa-brand .payroll-document-logo {
  display: block;
  flex: 0 0 auto;
  width: 94px;
  height: 94px;
  object-fit: contain;
}

html.fenisa-brand .payroll-company-identity {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

html.fenisa-brand .payroll-company-identity h1 {
  margin: 0;
  color: var(--fenisa-ink);
  font-size: 24px;
}

html.fenisa-brand .payroll-company-identity span {
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .payroll-document-title {
  display: flex;
  min-width: 260px;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  text-align: right;
}

html.fenisa-brand .payroll-document-title > span {
  color: var(--fenisa-red);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.11em;
}

html.fenisa-brand .payroll-document-title h2 {
  margin: 0;
  font-size: 23px;
}

html.fenisa-brand .payroll-document-title > strong {
  color: #4c4d53;
  font-size: 14px;
}

html.fenisa-brand .payroll-document-status {
  display: inline-block;
  padding: 4px 10px;
  border: 1px solid #d7d9df;
  border-radius: 20px;
  background: #f5f6f8;
  color: #484a50;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-document-status.status-paid {
  border-color: #b9dfca;
  background: #eff9f3;
  color: #1b7040;
}

html.fenisa-brand .payroll-document-status.status-approved {
  border-color: #c6d5f2;
  background: #f0f4fc;
  color: #355b9a;
}

html.fenisa-brand .payroll-document-status.status-draft {
  border-color: #f0d38c;
  background: #fff9e9;
  color: #755d19;
}

html.fenisa-brand .payroll-document-period {
  display: grid;
  grid-template-columns: 1.5fr 0.7fr 1fr 1fr;
  gap: 10px;
  margin: 20px 0;
}

html.fenisa-brand .payroll-document-period > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid #e8e9ec;
  border-radius: 6px;
  background: #fafbfc;
}

html.fenisa-brand .payroll-document-period span,
html.fenisa-brand .payroll-document-totals span {
  color: var(--fenisa-muted);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}

html.fenisa-brand .payroll-document-period strong {
  color: var(--fenisa-ink);
  font-size: 13px;
  overflow-wrap: anywhere;
}

html.fenisa-brand .payroll-document-totals {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 26px;
}

html.fenisa-brand .payroll-document-totals > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 7px;
  padding: 14px;
  border: 1px solid #e7e8eb;
  border-radius: 7px;
  background: #ffffff;
}

html.fenisa-brand .payroll-document-totals strong {
  color: #34353b;
  font-size: 17px;
  overflow-wrap: anywhere;
}

html.fenisa-brand .payroll-document-totals > .is-net {
  border-color: #b9dfca;
  background: #f1faf5;
}

html.fenisa-brand .payroll-document-totals > .is-net strong {
  color: #17693b;
  font-size: 19px;
}

html.fenisa-brand .payroll-document-totals.is-historical {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html.fenisa-brand .payroll-document-section {
  margin: 24px 0;
}

html.fenisa-brand .payroll-document-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
}

html.fenisa-brand .payroll-document-section-heading > div {
  display: flex;
  align-items: center;
  gap: 10px;
}

html.fenisa-brand .payroll-document-section-heading > div > span {
  display: grid;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 11px;
  font-weight: 700;
}

html.fenisa-brand .payroll-document-section-heading h3 {
  margin: 0;
  font-size: 16px;
}

html.fenisa-brand .payroll-document-section-heading p {
  margin: 0;
  color: var(--fenisa-muted);
  font-size: 12px;
  text-align: right;
}

html.fenisa-brand .payroll-run-details-table {
  width: 100%;
  min-width: 1060px;
  border: 1px solid #e2e4e8;
  font-size: 12px;
}

html.fenisa-brand .payroll-run-details-table > thead > tr > th {
  border-bottom: 1px solid #d9dbe0;
  background: #f3f4f6;
  color: #44464d;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  vertical-align: middle;
}

html.fenisa-brand .payroll-run-details-table > tbody > tr > td {
  vertical-align: middle;
}

html.fenisa-brand .payroll-run-details-table > tbody > tr > td:first-child {
  min-width: 145px;
}

html.fenisa-brand .payroll-run-details-table td small {
  display: block;
  max-width: 155px;
  margin-top: 4px;
  color: var(--fenisa-muted);
  font-size: 10px;
  white-space: normal;
}

html.fenisa-brand .payroll-run-details-table > tfoot > tr > th {
  border-top: 2px solid #bfc2c9;
  background: #f5f6f8;
  color: #28292e;
  white-space: nowrap;
}

html.fenisa-brand .payroll-run-source-section {
  margin-top: 16px;
}

html.fenisa-brand .payroll-run-audit {
  margin: 24px 0;
  padding: 16px 18px;
  border: 1px solid #e2e4e8;
  border-left: 4px solid var(--fenisa-red);
  border-radius: 6px;
  background: #fafbfc;
}

html.fenisa-brand .payroll-run-audit h3 {
  margin: 0 0 12px;
  font-size: 15px;
}

html.fenisa-brand .payroll-run-audit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

html.fenisa-brand .payroll-run-audit-grid > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

html.fenisa-brand .payroll-run-audit-grid span,
html.fenisa-brand .payroll-run-audit-grid small {
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .payroll-run-audit-grid strong {
  overflow-wrap: anywhere;
}

html.fenisa-brand .payroll-run-audit > p {
  margin: 12px 0 0;
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .payroll-document-legal {
  margin: 18px 0;
  padding: 12px 14px;
  border: 1px solid #f0d38c;
  border-left: 4px solid #d6a326;
  background: #fff9e9;
  color: #55451c;
  font-size: 11px;
  line-height: 1.5;
}

html.fenisa-brand .payroll-document-signatures {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 42px;
  margin: 42px 20px 26px;
  text-align: center;
}

html.fenisa-brand .payroll-document-signatures > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
}

html.fenisa-brand .payroll-document-signatures > div > span {
  width: 100%;
  height: 1px;
  border-top: 1px solid #55565b;
}

html.fenisa-brand .payroll-document-signatures strong {
  color: #4d4f55;
  font-size: 11px;
}

html.fenisa-brand .payroll-document-footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid #e3e5e9;
  color: #777981;
  font-size: 10px;
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-document-paper {
    padding: 20px 14px;
  }

  html.fenisa-brand .payroll-document-brand {
    align-items: flex-start;
    flex-direction: column;
  }

  html.fenisa-brand .payroll-document-logo {
    width: 72px;
    height: 72px;
  }

  html.fenisa-brand .payroll-document-title {
    min-width: 0;
    align-items: flex-start;
    text-align: left;
  }

  html.fenisa-brand .payroll-document-period {
    grid-template-columns: 1fr 1fr;
  }

  html.fenisa-brand .payroll-document-totals {
    grid-template-columns: 1fr 1fr;
  }

  html.fenisa-brand .payroll-document-section-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  html.fenisa-brand .payroll-document-section-heading p {
    text-align: left;
  }

  html.fenisa-brand .payroll-document-signatures {
    gap: 18px;
    margin-right: 0;
    margin-left: 0;
  }

  html.fenisa-brand .payroll-document-footer {
    flex-direction: column;
  }
}

html.fenisa-brand .payroll-document-paper {
  page: payroll;
}

@page payroll {
  size: A4 landscape;
  margin: 12mm;
}

@media print {
  html.fenisa-brand body {
    background: #ffffff !important;
    color: #202023 !important;
    font-size: 10px;
  }

  html.fenisa-brand .top-bar,
  html.fenisa-brand .left-bar,
  html.fenisa-brand .side-bar,
  html.fenisa-brand .payroll-document-actions,
  html.fenisa-brand .payroll-person-deduction-actions,
  html.fenisa-brand .payroll-monthly-notice {
    display: none !important;
  }

  html.fenisa-brand .wrapper,
  html.fenisa-brand .main-content,
  html.fenisa-brand .content,
  html.fenisa-brand .container-fluid,
  html.fenisa-brand .payroll-run-document,
  html.fenisa-brand .payroll-person-deduction-paper,
  html.fenisa-brand .payroll-document-paper {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  html.fenisa-brand .payroll-person-deduction-identity,
  html.fenisa-brand .payroll-person-deduction-totals {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  html.fenisa-brand .payroll-person-deduction-period {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  html.fenisa-brand .payroll-person-deduction-period > header,
  html.fenisa-brand .payroll-person-deduction-identity > div,
  html.fenisa-brand .payroll-person-deduction-totals > div,
  html.fenisa-brand .payroll-person-deduction-table th,
  html.fenisa-brand .payroll-person-deduction-table td {
    color: #202023 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  html.fenisa-brand .payroll-person-deduction-table {
    width: 100% !important;
    min-width: 0 !important;
    font-size: 9px;
  }

  html.fenisa-brand .row,
  html.fenisa-brand [class*="col-"] {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html.fenisa-brand .payroll-document-brand {
    padding: 0 0 10px;
    border-bottom: 2px solid #c71920;
  }

  html.fenisa-brand .payroll-document-logo {
    width: 66px;
    height: 66px;
  }

  html.fenisa-brand .payroll-company-identity h1 {
    font-size: 18px;
  }

  html.fenisa-brand .payroll-document-title h2 {
    font-size: 18px;
  }

  html.fenisa-brand .payroll-document-period {
    grid-template-columns: 1.5fr 0.7fr 1fr 1fr;
    margin: 10px 0;
  }

  html.fenisa-brand .payroll-document-period > div,
  html.fenisa-brand .payroll-document-totals > div {
    padding: 7px 9px;
  }

  html.fenisa-brand .payroll-document-totals {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 12px;
  }

  html.fenisa-brand .payroll-document-totals.is-historical {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html.fenisa-brand .payroll-document-totals strong {
    font-size: 13px;
  }

  html.fenisa-brand .payroll-document-section,
  html.fenisa-brand .payroll-run-audit,
  html.fenisa-brand .payroll-document-legal,
  html.fenisa-brand .payroll-document-signatures {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  html.fenisa-brand .payroll-document-section {
    margin: 12px 0;
  }

  html.fenisa-brand .payroll-document-section-heading {
    margin-bottom: 5px;
  }

  html.fenisa-brand .payroll-document-section-heading h3 {
    font-size: 12px;
  }

  html.fenisa-brand .table-responsive {
    overflow: visible !important;
  }

  html.fenisa-brand .payroll-run-details-table {
    width: 100% !important;
    min-width: 0 !important;
    margin-bottom: 4px;
    table-layout: auto;
    border-collapse: collapse !important;
    font-size: 8px;
  }

  html.fenisa-brand .payroll-run-details-table th,
  html.fenisa-brand .payroll-run-details-table td {
    padding: 4px 5px !important;
    border: 1px solid #cfd1d5 !important;
    color: #202023 !important;
    vertical-align: middle;
  }

  html.fenisa-brand .payroll-run-details-table > thead {
    display: table-header-group;
  }

  html.fenisa-brand .payroll-run-details-table tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  html.fenisa-brand .payroll-run-details-table td small {
    max-width: none;
    font-size: 7px;
  }

  html.fenisa-brand .payroll-run-audit {
    margin: 12px 0;
    padding: 9px;
  }

  html.fenisa-brand .payroll-run-audit h3 {
    margin-bottom: 6px;
    font-size: 12px;
  }

  html.fenisa-brand .payroll-run-audit-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html.fenisa-brand .payroll-document-legal {
    margin: 10px 0;
    padding: 8px;
    font-size: 8px;
  }

  html.fenisa-brand .payroll-document-signatures {
    margin: 28px 35px 18px;
  }

  html.fenisa-brand .payroll-document-footer {
    padding-top: 6px;
    font-size: 8px;
  }

  html.fenisa-brand .payroll-deductions-page > :not(.payroll-deductions-header):not(.payroll-deductions-summary):not(.payroll-deduction-report) {
    display: none !important;
  }

  html.fenisa-brand .payroll-deductions-header {
    margin: 0 0 10px !important;
  }

  html.fenisa-brand .payroll-deductions-header h2 {
    font-size: 17px !important;
  }

  html.fenisa-brand .payroll-deductions-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 10px;
  }

  html.fenisa-brand .payroll-deduction-summary-card {
    min-height: 0;
    padding: 7px;
    box-shadow: none;
  }

  html.fenisa-brand .payroll-deduction-summary-card strong {
    font-size: 11px;
  }

  html.fenisa-brand .payroll-deduction-summary-card span {
    font-size: 8px;
  }

  html.fenisa-brand .payroll-deduction-report {
    margin: 8px 0;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  html.fenisa-brand .payroll-deduction-report .panel-heading {
    padding: 7px 9px;
    background: #ffffff !important;
  }

  html.fenisa-brand .payroll-deduction-report .panel-heading h3 {
    font-size: 12px;
  }

  html.fenisa-brand .payroll-deduction-report .panel-body {
    padding: 7px !important;
  }

  html.fenisa-brand .payroll-deduction-report table {
    min-width: 0 !important;
    font-size: 7px;
  }

  html.fenisa-brand .payroll-deduction-report table th,
  html.fenisa-brand .payroll-deduction-report table td {
    padding: 3px !important;
    color: #202023 !important;
  }

  html.fenisa-brand .payroll-report-note {
    padding: 6px;
    font-size: 8px;
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .payroll-process-guide {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  html.fenisa-brand .payroll-period-banner {
    align-items: flex-start;
    flex-direction: column;
  }

  html.fenisa-brand .payroll-monthly-header {
    align-items: flex-start;
  }

  html.fenisa-brand .payroll-monthly-header h2 {
    font-size: 21px;
  }

  html.fenisa-brand .payroll-preview-actions {
    align-items: stretch;
    flex-direction: column;
    margin-left: 0;
    width: 100%;
  }

  html.fenisa-brand .payroll-preview-actions .btn,
  html.fenisa-brand .payroll-preview-actions form {
    width: 100%;
  }
}

@media print {
  html.fenisa-brand .payroll-process-guide,
  html.fenisa-brand .payroll-preview-actions,
  html.fenisa-brand .payroll-monthly-notice {
    display: none !important;
  }

  html.fenisa-brand .payroll-monthly-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
  }

  html.fenisa-brand .payroll-monthly-summary-card {
    padding: 8px;
  }

  html.fenisa-brand .payroll-monthly-summary-card > strong {
    font-size: 13px;
  }

  html.fenisa-brand .payroll-monthly-panel {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  html.fenisa-brand .payroll-monthly-table > thead > tr > th,
  html.fenisa-brand .payroll-monthly-table > tbody > tr > td,
  html.fenisa-brand .payroll-monthly-table > tfoot > tr > th {
    color: #202023 !important;
  }
}

html.fenisa-brand .dashboard-intro {
  position: relative;
  display: flex;
  align-items: center;
  gap: 22px;
  overflow: hidden;
  margin: 0 0 26px;
  padding: 24px 28px;
  border: 1px solid #8f171d;
  border-radius: 16px;
  background: linear-gradient(115deg, #6f1018 0%, #a3131b 52%, #d51d27 100%);
  box-shadow: 0 12px 28px rgba(91, 16, 21, 0.2);
  color: #ffffff;
  text-align: left;
}

html.fenisa-brand .dashboard-intro::after {
  position: absolute;
  top: -115px;
  right: 18%;
  width: 300px;
  height: 300px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(255, 255, 255, 0.035), 0 0 0 70px rgba(255, 255, 255, 0.025);
  content: "";
  pointer-events: none;
}

html.fenisa-brand .dashboard-intro__brand {
  z-index: 1;
  display: flex;
  width: 92px;
  height: 92px;
  flex: 0 0 92px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 5px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 14px;
  background: #26090b;
}

html.fenisa-brand .dashboard-intro__brand img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 9px;
  object-fit: contain;
}

html.fenisa-brand .dashboard-intro__content {
  z-index: 1;
  min-width: 0;
}

html.fenisa-brand .dashboard-intro__eyebrow {
  margin: 0 0 5px;
  color: #ffffff !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

html.fenisa-brand .dashboard-intro h1 {
  margin: 0;
  color: #ffffff !important;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.25;
}

html.fenisa-brand .dashboard-intro__description {
  margin: 7px 0 10px;
  color: #ffffff !important;
  font-size: 13px;
  line-height: 1.5;
}

html.fenisa-brand .dashboard-intro__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  color: #ffffff !important;
  font-size: 12px;
}

html.fenisa-brand .dashboard-intro__meta span,
html.fenisa-brand .dashboard-intro__meta i {
  color: #ffffff !important;
}

html.fenisa-brand .dashboard-intro__meta i {
  margin-right: 4px;
}

html.fenisa-brand .dashboard-intro__badge {
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  padding: 10px 13px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 24px;
  background: rgba(45, 6, 9, 0.48);
  color: #ffffff !important;
  font-size: 12px;
  white-space: nowrap;
}

html.fenisa-brand .dashboard-intro__badge i {
  color: #ffffff !important;
  font-size: 16px;
}

html.fenisa-brand .dashboard-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 13px;
  text-align: left;
}

html.fenisa-brand .dashboard-section-heading h2 {
  margin: 0 0 3px;
  color: var(--fenisa-ink);
  font-size: 19px;
  font-weight: 700;
}

html.fenisa-brand .dashboard-section-heading p {
  margin: 0;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .dashboard-section-heading__label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid var(--fenisa-border);
  border-radius: 20px;
  background: #ffffff;
  color: var(--fenisa-red-dark);
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

html.fenisa-brand .dashboard-period-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin: 0 0 16px;
  padding: 14px 16px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  background: #fffafa;
  text-align: left;
}

html.fenisa-brand .dashboard-period-filter strong,
html.fenisa-brand .dashboard-period-filter span {
  display: block;
}

html.fenisa-brand .dashboard-period-filter strong {
  color: var(--fenisa-ink);
}

html.fenisa-brand .dashboard-period-filter span,
html.fenisa-brand .dashboard-period-filter__message {
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .dashboard-period-filter__fields {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

html.fenisa-brand .dashboard-period-field {
  display: flex;
  align-items: center;
  gap: 8px;
}

html.fenisa-brand .dashboard-period-filter__fields label {
  margin: 0;
  color: var(--fenisa-muted);
  font-size: 11px;
  font-weight: 600;
}

html.fenisa-brand .dashboard-period-filter__fields input {
  min-width: 0;
  min-height: 36px;
  padding: 6px 9px;
  border: 1px solid var(--fenisa-border);
  border-radius: 7px;
  background: #ffffff;
}

html.fenisa-brand .dashboard-period-filter__fields .btn {
  min-height: 36px;
  border: 0;
  background: var(--fenisa-red);
}

html.fenisa-brand .dashboard-period-filter__message {
  flex-basis: 100%;
}

html.fenisa-brand .dashboard-chart-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin: 0 0 14px;
  padding: 14px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  background: #fffafa;
}

html.fenisa-brand .dashboard-chart-filters > div {
  min-width: 150px;
}

html.fenisa-brand .dashboard-chart-filters label {
  display: block;
  margin: 0 0 5px;
  color: var(--fenisa-muted);
  font-size: 11px;
  font-weight: 600;
}

html.fenisa-brand .dashboard-chart-filters input,
html.fenisa-brand .dashboard-chart-filters select {
  width: 100%;
  min-height: 36px;
  padding: 6px 9px;
  border: 1px solid var(--fenisa-border);
  border-radius: 7px;
  background: #ffffff;
}

html.fenisa-brand .dashboard-chart-filters .btn {
  min-height: 36px;
  border: 0;
  background: var(--fenisa-red);
}

html.fenisa-brand .dashboard-chart-summary {
  margin: 0 0 8px;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .dashboard-chart-filters + .dashboard-chart-summary + .chart {
  min-height: 330px;
  padding: 8px 8px 0;
}

html.fenisa-brand .dashboard-analytics-panel {
  overflow: hidden;
  border: 1px solid var(--fenisa-border);
  border-radius: 12px;
  box-shadow: 0 5px 18px rgba(32, 32, 35, 0.06);
}

html.fenisa-brand .dashboard-analytics-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin: -15px -15px 15px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--fenisa-border);
  background: linear-gradient(120deg, #fffafa, #ffffff);
  text-align: left;
}

html.fenisa-brand .dashboard-analytics-heading h4 {
  margin: 3px 0 4px;
  color: var(--fenisa-ink);
  font-size: 19px;
  font-weight: 700;
}

html.fenisa-brand .dashboard-analytics-heading p {
  margin: 0;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .dashboard-analytics-eyebrow {
  color: var(--fenisa-red-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

html.fenisa-brand .dashboard-analytics-badge {
  padding: 7px 10px;
  border-radius: 20px;
  background: #eaf6ed;
  color: #26723e;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

html.fenisa-brand .dashboard-analytics-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

html.fenisa-brand .dashboard-analytics-stat {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 76px;
  padding: 12px 15px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  background: #ffffff;
}

html.fenisa-brand .dashboard-analytics-stat__icon {
  display: flex;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-size: 20px;
}

html.fenisa-brand .dashboard-analytics-stat small,
html.fenisa-brand .dashboard-analytics-stat strong,
html.fenisa-brand .dashboard-analytics-stat div span {
  display: block;
}

html.fenisa-brand .dashboard-analytics-stat small,
html.fenisa-brand .dashboard-analytics-stat div span {
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .dashboard-analytics-stat strong {
  margin: 2px 0;
  color: var(--fenisa-ink);
  font-size: 18px;
}

html.fenisa-brand .warehouse-flow-label {
  display: block;
  margin-top: 5px;
  color: var(--fenisa-red-dark);
  font-size: 12px;
  font-weight: 600;
}

html.fenisa-brand .warehouse-page-header {
  margin: 0 auto 18px !important;
  padding: 18px 24px 20px;
  border: 1px solid var(--fenisa-border);
  border-radius: 14px;
  background: linear-gradient(135deg, #fffafa 0%, #ffffff 68%);
  box-shadow: 0 5px 16px rgba(32, 32, 35, 0.06);
  text-align: left !important;
}

html.fenisa-brand .warehouse-page-header__icon {
  display: flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  margin: 0 0 8px;
  border-radius: 12px;
  background: var(--fenisa-red);
  color: #ffffff;
  font-size: 23px;
  box-shadow: 0 4px 10px rgba(163, 19, 27, 0.2);
}

html.fenisa-brand .warehouse-page-header__eyebrow {
  color: var(--fenisa-red-dark);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

html.fenisa-brand .warehouse-page-header h3 {
  margin: 4px 0 6px;
  color: var(--fenisa-ink);
  font-size: 28px;
  font-weight: 700;
}

html.fenisa-brand .warehouse-page-header p {
  margin: 0 auto 12px;
  color: var(--fenisa-muted);
  font-size: 13px;
}

html.fenisa-brand .warehouse-page-header__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px 18px;
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .warehouse-page-header__meta i {
  margin-right: 3px;
  color: var(--fenisa-red-dark);
}

html.fenisa-brand .warehouse-page-header + .alert {
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
}

html.fenisa-brand .warehouse-page-header ~ .panel {
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(32, 32, 35, 0.05);
}

html.fenisa-brand .warehouse-page-header ~ .panel > .panel-heading {
  text-align: center !important;
}

html.fenisa-brand .warehouse-page-header ~ .panel > .panel-body {
  text-align: center;
}

html.fenisa-brand .warehouse-page-header ~ .panel .form-horizontal {
  text-align: left;
}

html.fenisa-brand .warehouse-page-header ~ .panel table th {
  text-align: center;
}

html.fenisa-brand .warehouse-summary-grid {
  display: grid;
  max-width: 1180px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
  margin: 0 auto 18px;
}

html.fenisa-brand .warehouse-summary-card {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 11px;
  padding: 14px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 3px 12px rgba(32, 32, 35, 0.045);
}

html.fenisa-brand .warehouse-summary-card__icon {
  display: flex;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  background: #fff1f2;
  color: var(--fenisa-red);
  font-size: 19px;
}

html.fenisa-brand .warehouse-summary-card__content {
  display: flex;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  gap: 3px;
}

html.fenisa-brand .warehouse-summary-card__label,
html.fenisa-brand .warehouse-summary-card__content > span:last-child {
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .warehouse-summary-card__content strong {
  overflow: hidden;
  color: var(--fenisa-ink);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.fenisa-brand .warehouse-summary-card__link {
  color: var(--fenisa-red-dark);
  font-size: 18px;
}

html.fenisa-brand .warehouse-priority {
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--fenisa-red-soft);
  color: var(--fenisa-red-dark);
  font-weight: 700;
}

html.fenisa-brand .warehouse-report-note {
  float: right;
  color: var(--fenisa-muted);
  font-size: 12px;
  font-weight: 400;
}

html.fenisa-brand .warehouse-kardex-report {
  margin-top: 18px !important;
}

html.fenisa-brand .warehouse-kardex-type {
  border-radius: 999px;
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 9px;
}

html.fenisa-brand .warehouse-kardex-in {
  background: #e4f5eb;
  color: #167044;
}

html.fenisa-brand .warehouse-kardex-out {
  background: #fde9e9;
  color: #a3131b;
}

html.fenisa-brand .warehouse-report-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: center;
  gap: 12px;
  text-align: left;
}

html.fenisa-brand .warehouse-export-actions {
  display: flex;
  gap: 6px;
}

html.fenisa-brand .warehouse-export-link {
  border: 0;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 700;
  padding: 9px 13px;
}

html.fenisa-brand .warehouse-export-link i {
  margin-right: 4px;
}

html.fenisa-brand .warehouse-export-link.btn-success {
  background: #238b57;
}

html.fenisa-brand .warehouse-export-link.btn-danger {
  background: #a3131b;
}

@media (max-width: 767px) {
  html.fenisa-brand .warehouse-export-actions {
    width: 100%;
  }

  html.fenisa-brand .warehouse-export-actions .warehouse-export-link {
    flex: 1;
  }
}

html.fenisa-brand .warehouse-report-filters > div {
  min-width: 220px;
}

html.fenisa-brand .warehouse-report-filters label {
  display: block;
  margin-bottom: 5px;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .warehouse-report-search {
  flex: 1 1 280px;
}

html.fenisa-brand .warehouse-search-input {
  position: relative;
}

html.fenisa-brand .warehouse-search-input > i {
  color: #777f8a;
  left: 12px;
  position: absolute;
  top: 11px;
  z-index: 1;
}

html.fenisa-brand .warehouse-search-input .form-control {
  padding-left: 34px;
  padding-right: 36px;
}

html.fenisa-brand .warehouse-search-clear {
  background: transparent;
  border: 0;
  color: #777f8a;
  cursor: pointer;
  display: none;
  font-size: 20px;
  line-height: 1;
  padding: 0;
  position: absolute;
  right: 11px;
  top: 7px;
  z-index: 1;
}

html.fenisa-brand .warehouse-search-clear.is-visible {
  display: block;
}

html.fenisa-brand .warehouse-search-clear:hover {
  color: #20252c;
}

html.fenisa-brand .warehouse-search-hint {
  color: var(--fenisa-muted);
  font-size: 11px;
  margin-top: 10px;
}

html.fenisa-brand .warehouse-search-hint i {
  margin-right: 4px;
}

html.fenisa-brand .warehouse-report-total {
  margin-top: 14px;
  color: var(--fenisa-muted);
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  font-size: 12px;
}

html.fenisa-brand .warehouse-stock-report table th,
html.fenisa-brand .warehouse-stock-report table td {
  vertical-align: middle;
}

html.fenisa-brand .warehouse-stock-table {
  margin-bottom: 0;
  border: 0;
  table-layout: fixed;
}

html.fenisa-brand .warehouse-stock-table thead th {
  background: #f5f6f8;
  border-top: 0;
  color: #555b66;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

html.fenisa-brand .warehouse-stock-table tbody td {
  border-color: #e6e8ed;
  font-size: 12px;
  height: 45px;
}

html.fenisa-brand .warehouse-stock-table tbody tr:hover {
  background: #fafbfc;
}

html.fenisa-brand .warehouse-col-location {
  width: 13%;
}

html.fenisa-brand .warehouse-col-code {
  width: 17%;
}

html.fenisa-brand .warehouse-col-quantity {
  width: 13%;
}

html.fenisa-brand .warehouse-col-status {
  width: 15%;
}

html.fenisa-brand .warehouse-stock-location,
html.fenisa-brand .warehouse-stock-code {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
}

html.fenisa-brand .warehouse-stock-location {
  color: #454b55;
  font-weight: 600;
}

html.fenisa-brand .warehouse-stock-code {
  background: #f0f2f5;
  border-radius: 5px;
  color: #4a5260;
  font-family: monospace;
  padding: 4px 6px;
}

html.fenisa-brand .warehouse-stock-name {
  color: #30343b;
  font-weight: 500;
  max-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.fenisa-brand .warehouse-stock-quantity {
  color: #20252c;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}

html.fenisa-brand .warehouse-status {
  border-radius: 999px;
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .02em;
  padding: 5px 8px;
  white-space: nowrap;
}

html.fenisa-brand .warehouse-status-success {
  background: #e7f6ed;
  color: #18733e;
}

html.fenisa-brand .warehouse-status-danger {
  background: #fde9e8;
  color: #a52e2b;
}

html.fenisa-brand .warehouse-status-neutral {
  background: #eef0f3;
  color: #69717d;
}

html.fenisa-brand .warehouse-legacy-preview {
  margin-top: 20px;
  border: 1px solid #ead8b4;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(32, 32, 35, 0.04);
}

html.fenisa-brand .warehouse-legacy-preview .panel-heading {
  background: #fffaf0;
  color: #70551d;
}

html.fenisa-brand .warehouse-legacy-preview .panel-heading .warehouse-report-note {
  color: #92733a;
}

html.fenisa-brand .warehouse-legacy-preview .panel-body p {
  margin: 0;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand .warehouse-legacy-summary {
  display: grid;
  max-width: 1180px;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 auto 18px;
}

html.fenisa-brand .warehouse-legacy-summary__card {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 14px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 3px 12px rgba(32, 32, 35, .045);
}

html.fenisa-brand .warehouse-legacy-summary__icon {
  display: flex;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: #fff5dc;
  color: #94701e;
  font-size: 19px;
}

html.fenisa-brand .warehouse-legacy-summary__card div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

html.fenisa-brand .warehouse-legacy-summary__card small,
html.fenisa-brand .warehouse-legacy-summary__card div span {
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .warehouse-legacy-summary__card strong {
  color: var(--fenisa-ink);
  font-size: 19px;
}

html.fenisa-brand .warehouse-legacy-notice {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 14px;
  padding: 10px 12px;
  border: 1px solid #ead8b4;
  border-radius: 7px;
  background: #fffaf0;
  color: #70551d;
  font-size: 12px;
  line-height: 1.45;
}

html.fenisa-brand .warehouse-legacy-notice i {
  flex: 0 0 auto;
  font-size: 16px;
}

@media (max-width: 767px) {
  html.fenisa-brand .warehouse-legacy-summary {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .warehouse-legacy-table-wrap {
    overflow: visible !important;
  }

  html.fenisa-brand .warehouse-legacy-table {
    display: block !important;
    width: 100% !important;
    overflow: visible !important;
  }

  html.fenisa-brand .warehouse-legacy-table thead {
    display: none;
  }

  html.fenisa-brand .warehouse-legacy-table tbody,
  html.fenisa-brand .warehouse-legacy-table tr,
  html.fenisa-brand .warehouse-legacy-table td {
    display: block;
    width: 100%;
  }

  html.fenisa-brand .warehouse-legacy-table tr {
    margin-bottom: 10px;
    padding: 8px 12px;
    border: 1px solid var(--fenisa-border);
    border-radius: 8px;
    background: #ffffff;
  }

  html.fenisa-brand .warehouse-legacy-table td {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0 !important;
    border: 0;
    text-align: right;
  }

  html.fenisa-brand .warehouse-legacy-table td::before {
    color: var(--fenisa-muted);
    content: attr(data-label);
    font-size: 11px;
    font-weight: 600;
    text-align: left;
    text-transform: uppercase;
  }
}

html.fenisa-brand .warehouse-report-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 12px 15px 15px;
}

html.fenisa-brand .warehouse-report-pagination > a {
  align-items: center;
  border: 1px solid #d5d9df;
  border-radius: 6px;
  color: #454b55;
  display: inline-flex;
  font-size: 12px;
  height: 30px;
  justify-content: center;
  min-width: 30px;
  padding: 0 8px;
  text-decoration: none;
}

html.fenisa-brand .warehouse-report-pagination > a:hover,
html.fenisa-brand .warehouse-report-pagination > a.active {
  background: #20252c;
  border-color: #20252c;
  color: #ffffff !important;
}

html.fenisa-brand .warehouse-report-pagination > a.disabled {
  cursor: default;
  opacity: .4;
  pointer-events: none;
}

html.fenisa-brand .warehouse-report-pagination .warehouse-pagination-arrow {
  font-size: 18px;
  line-height: 1;
}

html.fenisa-brand .warehouse-pagination-ellipsis {
  color: #7d858f;
  padding: 0 2px;
}

html.fenisa-brand .warehouse-detail-header__back {
  margin-bottom: 12px;
  font-size: 12px;
}

html.fenisa-brand .warehouse-detail-header__back a {
  color: var(--fenisa-red-dark);
  font-weight: 600;
}

html.fenisa-brand .warehouse-detail-report {
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
}

@media (max-width: 767px) {
  html.fenisa-brand .warehouse-detail-table-wrap {
    overflow: visible !important;
  }

  html.fenisa-brand .warehouse-detail-table {
    display: block !important;
    width: 100% !important;
    overflow: visible !important;
    border: 0;
  }

  html.fenisa-brand .warehouse-detail-table thead {
    display: none;
  }

  html.fenisa-brand .warehouse-detail-table tbody,
  html.fenisa-brand .warehouse-detail-table tr,
  html.fenisa-brand .warehouse-detail-table td {
    display: block;
    width: 100%;
  }

  html.fenisa-brand .warehouse-detail-table tr {
    margin-bottom: 10px;
    padding: 9px 12px;
    border: 1px solid var(--fenisa-border);
    border-radius: 8px;
    background: #ffffff;
  }

  html.fenisa-brand .warehouse-detail-table td {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0 !important;
    border: 0;
    text-align: right;
    overflow-wrap: anywhere;
  }

  html.fenisa-brand .warehouse-detail-table td::before {
    flex: 0 0 86px;
    color: var(--fenisa-muted);
    content: attr(data-label);
    font-size: 11px;
    font-weight: 600;
    text-align: left;
    text-transform: uppercase;
  }

  html.fenisa-brand .warehouse-detail-table td.warehouse-detail-table-empty {
    display: block;
    text-align: center;
  }

  html.fenisa-brand .warehouse-detail-table td.warehouse-detail-table-empty::before {
    display: none;
  }
}

html.fenisa-brand .warehouse-operations-grid {
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
}

html.fenisa-brand .warehouse-operations-grid .panel {
  height: calc(100% - 20px);
  border-radius: 12px;
}

html.fenisa-brand .warehouse-operation-card {
  max-width: 760px;
  margin: 24px auto;
  border-radius: 12px;
}

html.fenisa-brand .warehouse-operation-card .panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

html.fenisa-brand .warehouse-adjustment-steps {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 20px;
  color: var(--fenisa-muted);
  font-size: 11px;
}

html.fenisa-brand .warehouse-adjustment-steps span {
  display: flex;
  align-items: center;
  gap: 6px;
}

html.fenisa-brand .warehouse-adjustment-steps b {
  display: inline-flex;
  width: 23px;
  height: 23px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff0f1;
  color: var(--fenisa-red);
}

html.fenisa-brand .warehouse-adjustment-form {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

html.fenisa-brand .warehouse-adjustment-field label {
  display: block;
  margin-bottom: 6px;
  color: var(--fenisa-ink);
  font-size: 12px;
  font-weight: 600;
}

html.fenisa-brand .warehouse-adjustment-field small {
  display: block;
  margin-top: 6px;
  color: var(--fenisa-muted);
  font-size: 10px;
  line-height: 1.35;
}

html.fenisa-brand .warehouse-quantity-current {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 7px;
  padding: 8px 10px;
  border: 1px solid #dfe2e6;
  border-radius: 6px;
  background: #f7f8fa;
}

html.fenisa-brand .warehouse-quantity-current span {
  color: var(--fenisa-muted);
  font-size: 10px;
  text-transform: uppercase;
}

html.fenisa-brand .warehouse-quantity-current strong {
  color: var(--fenisa-red-dark);
  font-size: 16px;
}

html.fenisa-brand .warehouse-adjustment-form-actions {
  display: flex;
  grid-column: 1 / -1;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 5px;
}

html.fenisa-brand .warehouse-adjustment-report-summary {
  display: flex;
  max-width: 1180px;
  gap: 10px;
  margin: 0 auto 18px;
}

html.fenisa-brand .warehouse-adjustment-report-summary > div {
  display: flex;
  min-width: 170px;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
  border: 1px solid var(--fenisa-border);
  border-radius: 8px;
  background: #fff;
}

html.fenisa-brand .warehouse-adjustment-report-summary span {
  color: var(--fenisa-red);
  font-size: 18px;
}

html.fenisa-brand .warehouse-adjustment-report-summary strong {
  color: var(--fenisa-ink);
  font-size: 16px;
}

html.fenisa-brand .warehouse-adjustment-report-summary small {
  color: var(--fenisa-muted);
  font-size: 10px;
}

html.fenisa-brand .warehouse-adjustment-report {
  max-width: 1180px;
  margin: 18px auto;
  border-radius: 12px;
}

html.fenisa-brand .warehouse-adjustment-report .panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

html.fenisa-brand .warehouse-adjustment-positive { color: #18733e; font-weight: 700; }
html.fenisa-brand .warehouse-adjustment-negative { color: #a52e2b; font-weight: 700; }

@media (max-width: 767px) {
  html.fenisa-brand .warehouse-operation-card .panel-heading { align-items: flex-start; flex-direction: column; }
  html.fenisa-brand .warehouse-adjustment-steps { align-items: flex-start; flex-direction: column; }
  html.fenisa-brand .warehouse-adjustment-form { grid-template-columns: 1fr; }
  html.fenisa-brand .warehouse-adjustment-form-actions { grid-column: auto; justify-content: stretch; }
  html.fenisa-brand .warehouse-adjustment-form-actions .btn { flex: 1; }
  html.fenisa-brand .warehouse-adjustment-report-summary { flex-direction: column; }
  html.fenisa-brand .warehouse-adjustment-report .panel-heading { align-items: flex-start; flex-direction: column; }
  html.fenisa-brand .warehouse-adjustment-table-wrap { overflow: visible !important; }
  html.fenisa-brand .warehouse-adjustment-table { display: block !important; width: 100% !important; overflow: visible !important; }
  html.fenisa-brand .warehouse-adjustment-table thead { display: none; }
  html.fenisa-brand .warehouse-adjustment-table tbody,
  html.fenisa-brand .warehouse-adjustment-table tr,
  html.fenisa-brand .warehouse-adjustment-table td { display: block; width: 100%; }
  html.fenisa-brand .warehouse-adjustment-table tr { margin-bottom: 10px; padding: 8px 12px; border: 1px solid var(--fenisa-border); border-radius: 8px; background: #fff; }
  html.fenisa-brand .warehouse-adjustment-table td { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0 !important; border: 0; text-align: right; overflow-wrap: anywhere; }
  html.fenisa-brand .warehouse-adjustment-table td::before { color: var(--fenisa-muted); content: attr(data-label); font-size: 11px; font-weight: 600; text-align: left; text-transform: uppercase; }
}

html.fenisa-brand .warehouse-priority-report {
  margin: 24px auto;
  max-width: 1180px;
  border-radius: 12px;
  overflow: hidden;
}

html.fenisa-brand .warehouse-priority-report table {
  margin-bottom: 0;
}

html.fenisa-brand .warehouse-priority-report td,
html.fenisa-brand .warehouse-priority-report th {
  vertical-align: middle;
}

html.fenisa-brand .side-bar .menu-parent > li ul > li a,
html.fenisa-brand .left-bar .menu-parent > li ul > li a {
  white-space: normal;
  height: auto !important;
  min-height: 32px;
  line-height: 18px;
  padding-top: 7px;
  padding-bottom: 7px;
}

@media only screen and (min-width: 1025px) {
  html.fenisa-brand .left-bar,
  html.fenisa-brand .side-bar {
    width: 240px !important;
  }

  html.fenisa-brand .content {
    margin-left: 240px !important;
  }
}

@media only screen and (min-width: 802px) and (max-width: 1024px) {
  html.fenisa-brand .left-bar,
  html.fenisa-brand .side-bar {
    width: 225px !important;
  }

  html.fenisa-brand .left-bar .menu-parent > li > a,
  html.fenisa-brand .side-bar .menu-parent > li > a {
    width: 225px !important;
  }

  html.fenisa-brand .content {
    margin-left: 225px !important;
  }
}

html.fenisa-brand .left-bar .menu-parent > li ul > li a,
html.fenisa-brand .side-bar .menu-parent > li ul > li a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-right: 12px;
}

html.fenisa-brand .left-bar .menu-parent > li ul > li a i,
html.fenisa-brand .side-bar .menu-parent > li ul > li a i {
  flex: 0 0 22px;
  width: 22px;
  text-align: center;
}

@media (max-width: 767px) {
  html.fenisa-brand .warehouse-flow-label {
    display: block;
    margin-top: 5px;
  }

  html.fenisa-brand .warehouse-report-note {
    display: block;
    float: none;
    margin-top: 5px;
  }
}

html.fenisa-brand .dashboard-kpi-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

html.fenisa-brand .dashboard-kpi-grid > .col-lg-3 {
  width: 33.333333%;
}

html.fenisa-brand .dashboard-kpi-grid > [class*="col-"] {
  display: flex;
}

html.fenisa-brand .dashboard-kpi-grid > [class*="col-"] > a {
  display: block;
  width: 100%;
  text-decoration: none;
}

html.fenisa-brand .dashboard-kpi-grid .dashboard-stats {
  height: calc(100% - 16px);
}

html.fenisa-brand .dashboard-kpi-grid .dashboard-stats--revenue .left h3 {
  overflow: hidden;
  font-size: 21px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.fenisa-brand .dashboard-kpi-grid .dashboard-kpi-icon {
  font-size: 30px;
}

html.fenisa-brand .quick-actions {
  display: flex;
  flex-wrap: wrap;
}

html.fenisa-brand .quick-actions > .col-lg-6 {
  width: 20%;
  flex: 0 0 20%;
}

html.fenisa-brand .quick-actions .list-group-item {
  gap: 10px;
  padding: 10px 12px;
  line-height: 1.4;
}

html.fenisa-brand .quick-actions .list-group-item .quick-action-icon {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
  border-radius: 10px;
}

html.fenisa-brand .quick-actions .list-group-item .quick-action-icon img {
  width: 29px;
  height: 29px;
}

html.fenisa-brand.fenisa-dark .dashboard-intro {
  background: linear-gradient(115deg, #6f1018 0%, #a3131b 52%, #d51d27 100%) !important;
  color: #ffffff !important;
}

html.fenisa-brand .dashboard-intro .dashboard-intro__eyebrow,
html.fenisa-brand .dashboard-intro h1,
html.fenisa-brand .dashboard-intro .dashboard-intro__description,
html.fenisa-brand .dashboard-intro .dashboard-intro__meta,
html.fenisa-brand .dashboard-intro .dashboard-intro__meta span,
html.fenisa-brand .dashboard-intro .dashboard-intro__meta i,
html.fenisa-brand .dashboard-intro .dashboard-intro__badge,
html.fenisa-brand .dashboard-intro .dashboard-intro__badge i {
  color: #ffffff !important;
}

html.fenisa-brand.fenisa-dark .dashboard-intro .dashboard-intro__eyebrow,
html.fenisa-brand.fenisa-dark .dashboard-intro h1,
html.fenisa-brand.fenisa-dark .dashboard-intro .dashboard-intro__description,
html.fenisa-brand.fenisa-dark .dashboard-intro .dashboard-intro__meta,
html.fenisa-brand.fenisa-dark .dashboard-intro .dashboard-intro__meta span,
html.fenisa-brand.fenisa-dark .dashboard-intro .dashboard-intro__meta i,
html.fenisa-brand.fenisa-dark .dashboard-intro .dashboard-intro__badge,
html.fenisa-brand.fenisa-dark .dashboard-intro .dashboard-intro__badge i {
  color: #ffffff !important;
}

@media (max-width: 1199px) {
  html.fenisa-brand .dashboard-kpi-grid > .col-lg-3 {
    width: 33.333333%;
  }

  html.fenisa-brand .quick-actions > .col-lg-6 {
    width: 33.333333%;
    flex-basis: 33.333333%;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  html.fenisa-brand .dashboard-kpi-grid > .col-lg-3 {
    width: 50%;
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .dashboard-analytics-heading {
    flex-direction: column;
  }

  html.fenisa-brand .dashboard-analytics-stats {
    grid-template-columns: 1fr;
  }

  html.fenisa-brand .dashboard-intro {
    gap: 14px;
    margin-bottom: 20px;
    padding: 18px;
    border-radius: 13px;
  }

  html.fenisa-brand .dashboard-intro__brand {
    width: 68px;
    height: 68px;
    flex-basis: 68px;
  }

  html.fenisa-brand .dashboard-intro h1 {
    font-size: 20px;
  }

  html.fenisa-brand .dashboard-intro__description {
    font-size: 12px;
  }

  html.fenisa-brand .dashboard-intro__badge {
    display: none;
  }

  html.fenisa-brand .dashboard-section-heading h2 {
    font-size: 17px;
  }

  html.fenisa-brand .dashboard-period-filter {
    align-items: stretch;
  }

  html.fenisa-brand .dashboard-period-filter__fields {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
  }

  html.fenisa-brand .dashboard-period-field {
    display: block;
    min-width: 0;
  }

  html.fenisa-brand .dashboard-period-filter__fields input {
    display: block;
    width: 100%;
  }

  html.fenisa-brand .dashboard-period-filter__fields .btn {
    grid-column: 1 / -1;
    width: 100%;
  }

  html.fenisa-brand .dashboard-kpi-grid > .col-xs-12 {
    width: 50%;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats {
    min-height: 90px;
    padding-left: 10px;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats .left {
    max-width: 72%;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats .left h3 {
    font-size: 21px;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats--revenue .left h3 {
    font-size: 15px;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-kpi-icon {
    font-size: 24px;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats .left h4 {
    font-size: 11px;
    line-height: 1.3;
  }

  html.fenisa-brand .dashboard-chart-filters > div {
    width: 100%;
    min-width: 0;
  }

  html.fenisa-brand .dashboard-chart-filters + .dashboard-chart-summary + .chart {
    min-height: 250px;
    padding-right: 0;
    padding-left: 0;
  }

  html.fenisa-brand .dashboard-analytics-panel .chart {
    width: 100%;
    margin-right: 0;
  }

  html.fenisa-brand .dashboard-analytics-panel canvas {
    max-width: 100%;
  }

  html.fenisa-brand .quick-actions > .col-lg-6 {
    width: 100%;
    flex-basis: 100%;
  }
}

@media (max-width: 420px) {
  html.fenisa-brand .dashboard-intro {
    align-items: flex-start;
    padding: 15px;
  }

  html.fenisa-brand .dashboard-intro__brand {
    width: 54px;
    height: 54px;
    flex-basis: 54px;
    border-radius: 10px;
  }

  html.fenisa-brand .dashboard-intro h1 {
    font-size: 18px;
  }

  html.fenisa-brand .dashboard-intro__meta {
    gap: 5px 10px;
    font-size: 11px;
  }

  html.fenisa-brand .dashboard-period-filter__fields {
    grid-template-columns: minmax(0, 1fr);
  }

  html.fenisa-brand .dashboard-kpi-grid > .col-xs-12 {
    width: 100%;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats {
    min-height: 82px;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats .left {
    max-width: 76%;
  }

  html.fenisa-brand .dashboard-kpi-grid .dashboard-stats--revenue .left h3 {
    font-size: 20px;
  }

  html.fenisa-brand .dashboard-chart-filters + .dashboard-chart-summary + .chart {
    min-height: 220px;
  }
}

html.fenisa-brand .items-search-toolbar {
  margin: 0 0 15px;
}

html.fenisa-brand .items-search-toolbar ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--fenisa-border);
  border-radius: 10px;
  background: #ffffff;
}

html.fenisa-brand .items-search-toolbar ul > li {
  margin: 0;
}

html.fenisa-brand .items-search-toolbar ul > li:first-child {
  flex: 1 1 240px;
}

html.fenisa-brand .items-search-toolbar input,
html.fenisa-brand .items-search-toolbar select {
  min-height: 42px;
  border-color: #d6d9df;
  border-radius: 7px;
}

html.fenisa-brand .items-management-panel {
  overflow: hidden;
  border: 1px solid var(--fenisa-border);
  border-radius: 11px;
  box-shadow: var(--fenisa-shadow);
}

html.fenisa-brand .items-management-panel > .panel-heading {
  min-height: 58px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--fenisa-border);
  background: #ffffff;
}

html.fenisa-brand .items-management-panel > .panel-heading .panel-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 17px;
  font-weight: 700;
}

html.fenisa-brand .items-management-panel .items-management-table {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

html.fenisa-brand .items-management-panel .items-management-table > table {
  min-width: 760px;
  margin-bottom: 0;
}

html.fenisa-brand .items-management-panel .items-management-table > table > thead > tr > th {
  padding: 12px 10px;
  background: #f7f8fa !important;
  color: var(--fenisa-ink) !important;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

html.fenisa-brand .items-management-panel .items-management-table > table > tbody > tr > td {
  padding: 10px;
  border-color: #edf0f3;
  color: var(--fenisa-text) !important;
  vertical-align: middle;
}

html.fenisa-brand .items-management-panel .items-management-table > table > tbody > tr:hover > td {
  background: #fff8f8 !important;
}

html.fenisa-brand .items-pricing-panel {
  overflow: hidden;
  border: 1px solid var(--fenisa-border);
  border-radius: 11px;
  box-shadow: var(--fenisa-shadow);
}

html.fenisa-brand .items-pricing-panel > .panel-heading {
  padding: 16px 20px;
  border-bottom: 1px solid var(--fenisa-border);
  background: #fffafa;
}

html.fenisa-brand .items-pricing-panel > .panel-heading .panel-title {
  font-size: 18px;
  font-weight: 700;
}

html.fenisa-brand .items-pricing-panel .panel-body {
  padding: 20px;
}

html.fenisa-brand .items-tier-price-row {
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid #edf0f3;
}

html.fenisa-brand .items-tier-price-row > label {
  padding-top: 10px;
  color: var(--fenisa-ink);
  font-weight: 700;
}

html.fenisa-brand .items-tier-price-row .tier_dropdown_group {
  max-width: 190px;
}

html.fenisa-brand .items-tier-price-row .tier_dropdown {
  min-width: 150px;
}

html.fenisa-brand .items-tier-selection {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 0;
  color: var(--fenisa-ink) !important;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}

html.fenisa-brand .items-tier-selection input[type="checkbox"] {
  display: block !important;
  position: absolute;
  top: 50%;
  left: 15px;
  width: 22px;
  height: 22px;
  margin: 0;
  opacity: 0;
  transform: translateY(-50%);
  cursor: pointer;
}

html.fenisa-brand .items-tier-checkbox {
  display: inline-flex;
  flex: 0 0 22px;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 2px solid #68717e;
  border-radius: 5px;
  background: #ffffff;
  color: #ffffff;
}

html.fenisa-brand .items-tier-selection input[type="checkbox"]:checked + .items-tier-checkbox {
  border-color: #176b3a;
  background: #176b3a;
}

html.fenisa-brand .items-tier-selection input[type="checkbox"]:checked + .items-tier-checkbox::after {
  content: "";
  width: 10px;
  height: 6px;
  margin-top: -2px;
  border-bottom: 2px solid currentColor;
  border-left: 2px solid currentColor;
  transform: rotate(-45deg);
}

html.fenisa-brand .items-tier-selection input[type="checkbox"]:focus + .items-tier-checkbox {
  outline: 3px solid rgba(23, 107, 58, 0.24);
  outline-offset: 2px;
}

html.fenisa-brand .items-tier-selection-name {
  line-height: 1.35;
}

html.fenisa-brand .items-tier-help {
  margin: 2px 0 0;
  color: var(--fenisa-muted);
  font-size: 12px;
  line-height: 1.45;
}

html.fenisa-brand #price_tiers_limit_message {
  margin: 8px 0 0;
  color: var(--fenisa-muted);
  font-size: 12px;
}

html.fenisa-brand #add_tier.disabled {
  opacity: 0.5;
  pointer-events: none;
}

html.fenisa-brand.fenisa-dark .items-search-toolbar ul,
html.fenisa-brand.fenisa-dark .items-management-panel > .panel-heading,
html.fenisa-brand.fenisa-dark .items-pricing-panel > .panel-heading {
  background: #ffffff !important;
}

@media (max-width: 767px) {
  html.fenisa-brand .items-search-toolbar ul {
    align-items: stretch;
  }

  html.fenisa-brand .items-search-toolbar ul > li,
  html.fenisa-brand .items-search-toolbar ul > li:first-child {
    flex: 1 1 100%;
    width: 100%;
  }

  html.fenisa-brand .items-search-toolbar ul > li > input,
  html.fenisa-brand .items-search-toolbar ul > li > select,
  html.fenisa-brand .items-search-toolbar ul > li > button {
    width: 100%;
  }

  html.fenisa-brand .items-pricing-panel .panel-body {
    padding: 14px;
  }

  html.fenisa-brand .items-tier-price-row > label {
    display: block;
    padding: 0 15px 8px;
    text-align: left;
  }

  html.fenisa-brand .items-tier-selection {
    display: flex !important;
    align-items: center;
    min-height: 42px;
  }

  html.fenisa-brand .items-tier-price-row > div {
    width: 100%;
  }

  html.fenisa-brand .items-tier-price-row .tier_dropdown_group {
    max-width: 45%;
  }

  html.fenisa-brand .items-tier-price-row .tier_dropdown {
    min-width: 0;
    width: 100%;
  }
}

html.fenisa-brand #item_form {
  color: #252a32;
  font-size: 15px;
  line-height: 1.5;
}

html.fenisa-brand #item_form .panel-title,
html.fenisa-brand #item_form .control-label,
html.fenisa-brand #item_form .checkbox label,
html.fenisa-brand #item_form .radio label,
html.fenisa-brand #item_form .table > thead > tr > th {
  color: #20252d !important;
}

html.fenisa-brand #item_form .control-label {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
}

html.fenisa-brand #item_form .form-control,
html.fenisa-brand #item_form .selectize-input,
html.fenisa-brand #item_form .selectize-dropdown,
html.fenisa-brand #item_form .input-group-addon {
  color: #20252d !important;
  font-size: 15px;
}

html.fenisa-brand #item_form .form-control,
html.fenisa-brand #item_form .selectize-input {
  min-height: 42px;
}

html.fenisa-brand #item_form .help-block,
html.fenisa-brand #item_form small,
html.fenisa-brand #item_form .text-muted {
  color: #565d68 !important;
}

html.fenisa-brand #item_form a:not(.btn) {
  color: #9d1018;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}

html.fenisa-brand #item_form a:not(.btn):hover,
html.fenisa-brand #item_form a:not(.btn):focus {
  color: #710b11;
}

html.fenisa-brand .manage_buttons .modal-item-name,
html.fenisa-brand .manage_buttons .modal-item-category {
  color: #20252d;
}

html.fenisa-brand .nav-wizard > li > a {
  background-color: #f0f1f3 !important;
  border: 1px solid #d5d9df;
  color: #424955 !important;
  font-size: 14px;
  font-weight: 600;
}

html.fenisa-brand .nav-wizard > li.active > a,
html.fenisa-brand .nav-wizard > li.active > a:hover,
html.fenisa-brand .nav-wizard > li.active > a:focus {
  background-color: #8f1017 !important;
  border-color: #8f1017 !important;
  color: #ffffff !important;
}

html.fenisa-brand .nav-wizard > li > a:hover,
html.fenisa-brand .nav-wizard > li > a:focus {
  background-color: #e0e3e8 !important;
  color: #20252d !important;
}

html.fenisa-brand .nav-wizard.nav-progression > li.active > a:after {
  border-left-color: #8f1017 !important;
}

@media (max-width: 767px) {
  html.fenisa-brand #item_form .control-label {
    padding-bottom: 5px;
    text-align: left;
  }

  html.fenisa-brand .nav-wizard > li > a {
    padding: 10px 7px;
    font-size: 13px;
  }
}

html.fenisa-brand .category-management-panel {
  overflow: hidden;
  border: 1px solid var(--fenisa-border);
  border-radius: 14px;
  background: var(--fenisa-surface);
  box-shadow: var(--fenisa-shadow);
}

html.fenisa-brand .category-management-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 26px 30px;
  border-bottom: 1px solid var(--fenisa-border);
  background: linear-gradient(120deg, #fff 0%, #fff7f7 100%);
}

html.fenisa-brand .category-management-header h1 {
  margin: 4px 0 6px;
  color: var(--fenisa-ink);
  font-size: 26px;
  font-weight: 700;
}

html.fenisa-brand .category-management-header p,
html.fenisa-brand .category-tree-toolbar p {
  margin: 0;
  color: var(--fenisa-muted);
  font-size: 13px;
}

html.fenisa-brand .category-management-eyebrow {
  color: var(--fenisa-red-dark);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

html.fenisa-brand .category-management-separator {
  display: inline-block;
  width: 4px;
  height: 4px;
  margin: 0 7px 2px;
  border-radius: 50%;
  background: var(--fenisa-red-action);
}

html.fenisa-brand .category-add-root {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}

html.fenisa-brand .category-management-content {
  padding: 24px 30px 30px;
}

html.fenisa-brand .category-tree-toolbar {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 360px);
  align-items: center;
  gap: 6px 18px;
  margin-bottom: 20px;
}

html.fenisa-brand .category-tree-toolbar > label {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  color: #343a44;
  font-size: 13px;
  font-weight: 600;
}

html.fenisa-brand .category-tree-toolbar p {
  grid-column: 1;
  grid-row: 1;
}

html.fenisa-brand .category-tree-search-wrap {
  position: relative;
  grid-column: 2;
  grid-row: 2;
}

html.fenisa-brand .category-tree-search-wrap > i {
  position: absolute;
  z-index: 2;
  top: 12px;
  left: 13px;
  color: #69717d;
  font-size: 17px;
}

html.fenisa-brand #category-tree-search {
  min-height: 42px;
  padding-left: 38px;
  border: 1px solid #d6dae1;
  border-radius: 8px;
  color: var(--fenisa-ink);
  font-size: 14px;
}

html.fenisa-brand #category-tree-search:focus {
  border-color: #cf5358;
  box-shadow: 0 0 0 3px rgba(199, 25, 32, 0.12);
}

html.fenisa-brand #category_tree ul.category-tree-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

html.fenisa-brand #category_tree > ul.category-tree-list {
  display: grid;
  gap: 12px;
}

html.fenisa-brand #category_tree .category-tree-item {
  margin: 0;
  line-height: 1.4;
}

html.fenisa-brand #category_tree .category-tree-card {
  overflow: hidden;
  position: relative;
  border: 1px solid #e1e4e9;
  border-left: 6px solid var(--category-color, var(--fenisa-red));
  border-radius: 10px;
  background: #fff;
  box-shadow: inset 0 3px 0 var(--category-color, var(--fenisa-red));
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

html.fenisa-brand #category_tree .category-tree-card:hover {
  border-color: var(--category-color, #d4a1a3);
  box-shadow: inset 0 3px 0 var(--category-color, var(--fenisa-red)), 0 4px 14px rgba(32, 32, 35, 0.10);
  transform: translateY(-1px);
}

html.fenisa-brand .category-tree-color-strip {
  height: 5px;
  background: var(--category-color, var(--fenisa-red));
}

html.fenisa-brand .category-tree-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 58px;
  padding: 11px 14px;
}

html.fenisa-brand .category-tree-name {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--category-color, #252a32);
  font-size: 15px;
  font-weight: 650;
  overflow-wrap: anywhere;
}

html.fenisa-brand .category-tree-color {
  display: inline-block;
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(32, 32, 35, 0.18);
}

html.fenisa-brand .category-tree-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 7px;
  border-radius: 999px;
  background: #f7f8fa;
  border: 1px solid var(--category-color);
  color: var(--category-color);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}

html.fenisa-brand .category-tree-badge-root {
  background: #f7e9e9;
  color: var(--fenisa-red);
}

html.fenisa-brand .category-tree-icon {
  flex: 0 0 auto;
  color: var(--category-color, var(--fenisa-red));
  font-size: 20px;
}

html.fenisa-brand .category-tree-actions {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

html.fenisa-brand .category-tree-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 6px 9px;
  border: 1px solid #e0e3e8;
  border-radius: 7px;
  background: #fff;
  color: #343a44 !important;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none !important;
}

html.fenisa-brand .category-tree-action:hover,
html.fenisa-brand .category-tree-action:focus {
  border-color: #c8cdd5;
  background: #f6f7f9;
  color: #20252d !important;
}

html.fenisa-brand .category-tree-action.category-tree-delete {
  color: #a51d25 !important;
}

html.fenisa-brand .category-tree-action.category-tree-delete:hover,
html.fenisa-brand .category-tree-action.category-tree-delete:focus {
  border-color: #efc5c7;
  background: #fff3f3;
}

html.fenisa-brand .category-tree-settings {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 22px;
  padding: 10px 14px;
  border-top: 1px solid #edf0f3;
  background: #fafbfc;
}

html.fenisa-brand .category-tree-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #505864;
  cursor: pointer;
  font-size: 12px;
  font-weight: 500;
}

html.fenisa-brand .category-tree-toggle input[type="checkbox"] {
  display: none !important;
}

html.fenisa-brand .category-tree-checkmark {
  position: relative;
  display: inline-block;
  flex: 0 0 17px;
  width: 17px;
  height: 17px;
  border: 1px solid #aeb5bf;
  border-radius: 4px;
  background: #fff;
}

html.fenisa-brand .category-tree-toggle input[type="checkbox"]:checked + .category-tree-checkmark {
  border-color: var(--fenisa-red);
  background: var(--fenisa-red);
}

html.fenisa-brand .category-tree-toggle input[type="checkbox"]:checked + .category-tree-checkmark::after {
  position: absolute;
  top: 1px;
  left: 5px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  content: "";
  transform: rotate(45deg);
}

html.fenisa-brand .category-tree-toggle input[type="checkbox"]:focus + .category-tree-checkmark {
  outline: 3px solid rgba(199, 25, 32, 0.16);
}

html.fenisa-brand #category_tree > ul.category-tree-list > .category-tree-item > .category-tree-list {
  margin: 10px 0 0 20px;
  padding-left: 16px;
  border-left: 2px solid #f0d3d4;
}

html.fenisa-brand #category_tree .category-tree-list .category-tree-list {
  display: grid;
  gap: 10px;
  margin: 10px 0 0 12px;
  padding-left: 15px;
  border-left: 1px solid #e5e8ed;
}

html.fenisa-brand .category-tree-empty {
  padding: 34px 20px;
  border: 1px dashed #d9dde4;
  border-radius: 10px;
  background: #fafbfc;
  color: #555d68;
  text-align: center;
}

html.fenisa-brand .category-tree-empty > span {
  display: block;
  margin-bottom: 8px;
  color: #a21a21;
  font-size: 26px;
}

html.fenisa-brand .category-tree-empty strong {
  display: block;
  color: #282d35;
  font-size: 15px;
}

html.fenisa-brand .category-tree-empty p {
  margin: 6px 0 0;
  color: #69717d;
  font-size: 13px;
}

@media (max-width: 767px) {
  html.fenisa-brand .category-management-header {
    align-items: flex-start;
    flex-direction: column;
    padding: 20px;
  }

  html.fenisa-brand .category-management-header h1 {
    font-size: 22px;
  }

  html.fenisa-brand .category-management-content {
    padding: 18px 14px 22px;
  }

  html.fenisa-brand .category-tree-toolbar {
    display: flex;
    align-items: stretch;
    flex-direction: column;
  }

  html.fenisa-brand .category-tree-toolbar p {
    order: 3;
  }

  html.fenisa-brand .category-tree-main {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  html.fenisa-brand .category-tree-actions {
    justify-content: flex-start;
    width: 100%;
  }

  html.fenisa-brand .category-tree-action {
    min-height: 36px;
  }

  html.fenisa-brand #category_tree > ul.category-tree-list > .category-tree-item > .category-tree-list {
    margin-left: 8px;
    padding-left: 10px;
  }
}

html.fenisa-brand .sales-item-tier-picker {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin-top: 5px;
  line-height: 1.3;
}

html.fenisa-brand .register-box .register-items-holder .register-item-name-cell {
  min-width: 150px;
  max-width: 230px;
}

html.fenisa-brand .register-box .register-items-holder .register-item-code {
  margin: 3px 8px;
  color: #8f1017;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

html.fenisa-brand .register-box .register-items-holder .register-item-stock {
  margin: 2px 8px;
  color: #315f3b;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}

html.fenisa-brand .item-suggestions .details .sales-suggestion-code {
  color: #8f1017;
  font-size: 15px;
  font-weight: 700;
}

html.fenisa-brand .item-suggestions .details .sales-suggestion-quantity {
  font-size: 15px;
}

html.fenisa-brand .item-suggestions .details .sales-suggestion-tier-price {
  color: #8f1017;
  font-size: 15px;
  font-weight: 700;
}

html.fenisa-brand .item-suggestions .details .name {
  font-size: 15px;
}

html.fenisa-brand #register th.sales_discount,
html.fenisa-brand #register td.sales-discount-cell {
  display: none !important;
}

html.fenisa-brand .register .register-items .register-items-holder .register-item-content .register-item-name {
  display: -webkit-box;
  width: 100%;
  max-width: 230px;
  padding: 6px 8px;
  overflow: hidden;
  color: #315f9e;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  border-radius: 6px;
}

html.fenisa-brand .register .register-items-holder .register-item-name:hover,
html.fenisa-brand .register .register-items-holder .register-item-name:focus {
  color: #8f1017;
  background: #fff3f3;
  text-decoration: none;
}

html.fenisa-brand .sales-receipt-format {
  margin-top: 10px;
}

html.fenisa-brand .sales-receipt-format label {
  display: block;
  margin-bottom: 5px;
  color: #414b57;
  font-size: 12px;
  font-weight: 600;
}

html.fenisa-brand .sales-receipt-format select {
  min-height: 38px;
  border-color: #d5dbe3;
  border-radius: 7px;
  color: #263342;
}

html.fenisa-brand .sales-receipt-format select:focus {
  border-color: #8e141a;
  box-shadow: 0 0 0 2px rgba(142, 20, 26, 0.12);
}

html.fenisa-brand .credit-due-date-control {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

html.fenisa-brand .credit-due-date-control input[type="date"] {
  min-width: 0;
  min-height: 44px;
  flex: 1 1 auto;
  border-color: #d5dbe3;
  border-radius: 7px;
  cursor: pointer;
}

html.fenisa-brand .credit-due-date-control input[type="date"]:focus {
  border-color: #8e141a;
  box-shadow: 0 0 0 2px rgba(142, 20, 26, 0.12);
}

html.fenisa-brand .credit-due-date-picker-button {
  display: inline-flex;
  min-width: 46px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid #e4c7c8;
  border-radius: 7px;
  background: #fff8f8;
  color: #8f1017;
  font-size: 19px;
}

html.fenisa-brand .credit-due-date-picker-button:hover,
html.fenisa-brand .credit-due-date-picker-button:focus {
  border-color: #c71920;
  background: #fce9e9;
  outline: none;
}

html.fenisa-brand .credit-due-date-days {
  display: block;
  margin-top: 7px;
  color: #526170;
  font-weight: 600;
}

html.fenisa-brand .credit-due-date-days.is-invalid {
  color: #a3131b;
}

html.fenisa-brand .sales-item-tier-caption {
  color: #555d68;
  font-size: 11px;
  font-weight: 600;
}

html.fenisa-brand .sales-item-tier-input {
  display: inline-flex;
  align-items: center;
  min-height: 29px;
  max-width: 150px;
  padding: 3px 24px 3px 8px;
  border: 1px solid #e4c7c8;
  border-radius: 12px;
  background: #fff8f8;
  color: #8f1017 !important;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  text-overflow: ellipsis;
}

html.fenisa-brand .sales-item-tier-input:hover,
html.fenisa-brand .sales-item-tier-input:focus {
  border-color: #c71920;
  background: #fce9e9;
  color: #710b11 !important;
  outline: none;
  box-shadow: 0 0 0 2px rgba(199, 25, 32, 0.12);
}

html.fenisa-brand .sales-item-tier-input:disabled {
  cursor: wait;
  opacity: 0.65;
}

html.fenisa-brand .sales-item-tier-label {
  display: inline-flex;
  align-items: center;
  max-width: 150px;
  padding: 4px 8px;
  border: 1px solid #e4c7c8;
  border-radius: 12px;
  background: #fff8f8;
  color: #8f1017 !important;
  font-size: 11px;
  font-weight: 600;
  vertical-align: middle;
}

@media (max-width: 767px) {
  html.fenisa-brand .register-box .register-items-holder .register-item-name-cell {
    min-width: 160px;
    max-width: 180px;
  }

  html.fenisa-brand .register .register-items .register-items-holder .register-item-content .register-item-name {
    max-width: 180px;
    font-size: 15px;
    -webkit-line-clamp: 3;
  }

  html.fenisa-brand .sales-item-tier-input,
  html.fenisa-brand .sales-item-tier-caption,
  html.fenisa-brand .sales-item-tier-label {
    font-size: 10px;
  }
  html.fenisa-brand .sales-item-tier-input,
  html.fenisa-brand .sales-item-tier-label {
    max-width: 125px;
  }
}

html.fenisa-brand .left-bar #mainMenu > li > ul > li {
  padding: 2px 6px;
}

html.fenisa-brand .left-bar #mainMenu > li > ul > li > a {
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  column-gap: 10px;
  width: 100% !important;
  height: auto !important;
  min-height: 40px;
  padding: 8px 12px !important;
  overflow: visible !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 500;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  text-decoration: none;
  border-radius: 5px;
}

html.fenisa-brand .left-bar #mainMenu > li > ul > li > a i {
  position: static;
  width: 22px;
  margin: 0;
  padding: 0 !important;
  color: #b7dbea !important;
  font-size: 16px;
  line-height: 1.2;
  text-align: center;
}

html.fenisa-brand .left-bar #mainMenu > li > ul > li.active_submenu_link > a,
html.fenisa-brand .left-bar #mainMenu > li > ul > li > a:hover,
html.fenisa-brand .left-bar #mainMenu > li > ul > li > a:focus-visible {
  background: #292929 !important;
  color: #ffffff !important;
}

html.fenisa-brand .left-bar #mainMenu > li > ul > li > a:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: -2px;
}

@media (max-width: 767px) {
  html.fenisa-brand .left-bar #mainMenu > li > ul > li > a {
    font-size: 14px !important;
  }
}

@media (max-width: 767px) {
  html.fenisa-brand #register {
    display: block;
    width: 100%;
    table-layout: fixed;
    overflow: visible;
  }

  html.fenisa-brand #register thead {
    display: none;
  }

  html.fenisa-brand #register tbody.register-item-content {
    display: block;
    width: 100%;
  }

  html.fenisa-brand #register tbody.register-item-content > tr.register-item-details {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 12px 10px 14px 36px;
    border-bottom: 1px solid var(--fenisa-border);
  }

  html.fenisa-brand #register tbody.register-item-content > tr.register-item-details > td {
    display: block;
    width: auto;
    min-width: 0;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
    overflow-wrap: anywhere;
  }

  html.fenisa-brand #register tbody.register-item-content > tr.register-item-details > td:first-child {
    position: absolute;
    top: 14px;
    left: 4px;
    width: 27px;
    text-align: center !important;
  }

  html.fenisa-brand #register .register-item-name-cell,
  html.fenisa-brand #register .register-item-price-cell {
    grid-column: 1 / -1;
  }

  html.fenisa-brand #register .register-item-name-cell {
    max-width: none;
    padding-bottom: 2px !important;
  }

  html.fenisa-brand #register .register-item-name {
    max-width: 100%;
    padding: 6px 8px;
  }

  html.fenisa-brand #register .register-item-code,
  html.fenisa-brand #register .register-item-stock {
    margin-right: 2px;
    margin-left: 2px;
  }

  html.fenisa-brand #register .register-item-price-cell,
  html.fenisa-brand #register .register-item-quantity-cell,
  html.fenisa-brand #register .register-item-total-cell {
    min-height: 60px;
    padding: 9px 10px !important;
    border: 1px solid var(--fenisa-border) !important;
    border-radius: 8px;
    background: #f8f9fb;
    color: var(--fenisa-ink);
    font-size: 15px;
    font-weight: 600;
  }

  html.fenisa-brand #register .register-item-price-cell::before,
  html.fenisa-brand #register .register-item-quantity-cell::before,
  html.fenisa-brand #register .register-item-total-cell::before {
    display: block;
    margin-bottom: 5px;
    color: var(--fenisa-muted);
    content: attr(data-label);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
  }

  html.fenisa-brand #register .register-item-price-cell > a {
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
  }

  html.fenisa-brand .register-box .sales-item-tier-picker {
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap: 5px;
    width: 100%;
    margin-top: 10px;
    text-align: left;
  }

  html.fenisa-brand .register-box .sales-item-tier-caption {
    color: #414b57;
    font-size: 13px;
    line-height: 1.3;
  }

  html.fenisa-brand .register-box .sales-item-tier-input,
  html.fenisa-brand .register-box .sales-item-tier-label {
    box-sizing: border-box;
    width: 220px;
    max-width: 100%;
    min-height: 42px;
    padding: 8px 32px 8px 12px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.3;
    text-overflow: clip;
    white-space: normal;
  }

}

@media (max-width: 360px) {
  html.fenisa-brand #register tbody.register-item-content > tr.register-item-details {
    gap: 6px;
    padding-right: 7px;
    padding-left: 32px;
  }

  html.fenisa-brand #register .register-item-price-cell,
  html.fenisa-brand #register .register-item-quantity-cell,
  html.fenisa-brand #register .register-item-total-cell {
    padding: 8px !important;
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  html.fenisa-brand .register-box .sales-item-tier-picker {
    align-items: flex-start;
    flex-direction: column;
    justify-content: flex-start;
    gap: 5px;
    width: 100%;
    margin-top: 10px;
    text-align: left;
  }

  html.fenisa-brand .register-box .sales-item-tier-caption {
    color: #414b57;
    font-size: 13px;
    line-height: 1.3;
  }

  html.fenisa-brand .register-box .sales-item-tier-input,
  html.fenisa-brand .register-box .sales-item-tier-label {
    box-sizing: border-box;
    width: 220px;
    max-width: 100%;
    min-height: 42px;
    padding: 8px 32px 8px 12px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.3;
    text-overflow: clip;
    white-space: normal;
  }
}

@media (max-width: 1170px) {
  html.fenisa-brand .register .register-items-form .item-form .input-group-mobile.input-group {
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch;
    height: auto;
    margin-bottom: 16px;
  }

  html.fenisa-brand .register .register-items-form .item-form .input-group-mobile .input-group-addon {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    width: auto !important;
    min-width: 0;
    min-height: 44px;
    height: auto;
    padding: 6px 10px !important;
  }

  html.fenisa-brand .register .register-items-form .item-form .input-group-mobile .input-group-addon a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: normal;
  }
}