.page-body {
  min-height: 100vh;
}

/*
-------------------------------------
| clignotement
-------------------------------------
*/
@keyframes clignotement {
  0%, 100% { 
    opacity: 1;
    background-color: #fff;
  }
  50% { 
    opacity: 0.3;
    background-color: #000;
  }
}


/*
-------------------------------------
| COMPONEMT: cpn-btn--cashbox
-------------------------------------
*/
.cpn-btn--cashbox {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background-color: #16a34a;
  border: solid 1px #15803d;
  font-size: 0.875rem;
  color: #fff;
  padding: 8px 24px;
  border-radius: 30px;
  height: 38px;
}

.cpn-btn--cashbox> .cpn-btn__text {
  font-family: "ExoMedium", sans-serif;
}

.cpn-btn--cashbox>.cpn-icon {
  background-color: #fff;
  min-width: 16px;
  min-height: 16px;
  mask-size: 16px 16px;
}


.cpn-btn__bag {
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background-color: #fff;
  /* animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; */
  animation: clignotement 5s cubic-bezier(0.4, 0, 0.6, 1)  infinite;
}

.cpn-btn--cashbox:hover {
  background-color: #066c2c;
}
.cpn-btn--cashbox:hover .cpn-btn__text {
  color: #fff;
}

.cpn-btn--cashbox:hover >.cpn-icon{
  background-color: #fff;
}

/*
-------------------------------------
| COMPONEMT: cpn-btn--revenue
-------------------------------------
*/
.cpn-btn--revenue {
  display: flex;
  align-items: center;
  height: 38px;
  padding: 0 16px;
  background-color: #8f4e001a;
  border: solid 1px #8f4e0033;
  margin-left: auto;
  color: #8f4e00;
  border-radius: 8px;
  gap: 8px;
  overflow: hidden;
}

.cpn-btn--revenue .cpn-btn__icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  border-radius: 24px;
  background-color: #8f4e00;
}

.cpn-btn--revenue .cpn-btn__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-width: 0;
  line-height: 1.25;
}

.cpn-btn--revenue .cpn-btn__label {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.65rem;
  color: #a2825c;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cpn-btn--revenue .cpn-btn__value {
  font-family: "ExoBold", sans-serif;
  font-size: 0.875rem;
  white-space: nowrap;
}

.cpn-btn--revenue>.cpn-btn__icon-wrap>.cpn-icon {
  background-color: #fff;
  min-width: 16px;
  min-height: 16px;
  mask-size: 16px 16px;
}


/*
-------------------------------------
| modal-user-session
-------------------------------------
*/
.modal-user-session__head {
  display: flex;
  justify-content: center;
  background-color: #231A12;
  min-height: 70px;
  padding: 0 !important;
}

.modal-user-session__head::before {
  content: "";
  display: inline-block;
  position: absolute;
  background-color: #231A12;
  width: calc(100% + 20px);
  height: calc(100% + 10px);
  top: -10px;
  left: -10px;
}

.modal-user-session__role {
  color: #fff;
  margin-top: 5px;
}

.modal-user-session__icon-wrap {
  position: absolute;
  width: 60px;
  height: 60px;
  left: calc(50% - 30px);
  bottom: -25px;
}

.modal-user-session__icon-wrap .cpn-icon {
  background-color: #8F4E00;
}

.modal-user-session__title {
  font-family: "ExoBold", sans-serif;
  font-size: 1.6rem;
  color: #231A12;
  text-align: center;
  padding-top: 20px;
}

.modal-user-session .cpn-form {
  max-width: 400px;
  margin: auto;
}

.modal-user-session__question {
  font-family: "ExoMedium", sans-serif;
  font-size: 1rem;
  text-align: center;
  color: #a35b00;
}

.cpn-onsite-review__intro {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.9rem;
  text-align: center;
  color: #564334;
  margin-bottom: 12px;
}

.cpn-onsite-review__reason {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.85rem;
  background-color: #f2e9e3;
  border-radius: 4px;
  padding: 8px 10px;
  margin-bottom: 15px;
  color: #564334;
}

/*
-----------------------------------------
| COMPONEMT: cpn-summary-casher-session
-----------------------------------------
*/
.cpn-summary-casher-session {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
}

.cpn-summary-casher-session__inner {
  max-height: calc(100vh - 275px);
  overflow: auto;
}

.cpn-summary-casher-session__section {
  padding: 0 5px;
  margin-bottom: 15px;
}

.cpn-summary-casher-session__section-inner {
  display: flex;
  gap: 10px;
}

.cpn-summary-casher-session__total-boxs {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: column;
  gap: 10px;
  max-width: 200px;
}

.cpn-summary-casher-session__total-box {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 200px;
  padding: 10px;
  border-radius: 4px;
}

.cpn-summary-casher-session__paiement-modes {
  flex: 1;
}

.cpn-summary-casher-session__total-box--init-balance {
  background-color: #1d99ff;
  max-height: 80px;
}
.cpn-summary-casher-session__total-box--inputs {
  background-color: #22C55E;
}
.cpn-summary-casher-session__total-box--outputs {
  background-color: #FFDAD6;
}

.cpn-summary-casher-session__total-box-label {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.75rem;
  color: #C3FFD9;
}

.cpn-summary-casher-session__total-box-transaction {
  font-size: 0.75rem;
  color: #373636;
  display: flex;
  align-items: center;
  gap: 5px;
}

.cpn-summary-casher-session__total-box-transaction .cpn-icon {
  background-color: #757575;
}

.cpn-summary-casher-session__total-box-value {
  font-family: "ExoBold", sans-serif;
  font-size: 1.5rem;
  color: #fff;
  margin:  auto 0;
}

.cpn-summary-casher-session__total-box--init-balance .cpn-summary-casher-session__total-box-label {
  color: #064b84;
}

.cpn-summary-casher-session__total-box--inputs .cpn-summary-casher-session__total-box-label {
  color: #C3FFD9;
}

.cpn-summary-casher-session__total-box--init-balance .cpn-summary-casher-session__total-box-value {
  color: #033c6b;
}

.cpn-summary-casher-session__total-box--outputs .cpn-summary-casher-session__total-box-label,
.cpn-summary-casher-session__total-box--outputs .cpn-summary-casher-session__total-box-value  {
  color: #93000A;
}


.cpn-summary-casher-session__paiement-modes-title {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.75rem;
  color: #564334;
  margin-bottom: 5px;
}
.cpn-summary-casher-session__paiement-modes-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.cpn-summary-casher-session__paiement-modes-item {
  display: flex;
  background-color: #FFF1E8;
  border: solid 1px #DCC2AE;
  padding: 8px 8px;
  border-radius: 4px;
}

.cpn-summary-casher-session__paiement-modes-item-name {
  font-size: 0.875rem;
  color: #231A12;
}

.cpn-summary-casher-session__paiement-modes-item-value {
  font-family: "ExoBold", sans-serif;
  margin-left: auto;
  font-size: 1rem;
  color: #231A12;
}

.ui-modal__body.large {
  padding: 10px 0;
}

.ui-modal__body.large form {
  max-width: 100%;
}

.cpn-summary-casher-session__paiement-modes-item-icon-wrap {
  margin-right: 3px;
  padding-top: 2px;
}

.cpn-summary-casher-session__paiement-modes-item-icon-wrap .cpn-icon {
  background-color: #83786f;
}

.cpn-summary-casher-session__paiement-modes-item-name {
  font-family: 'ExoMedium', sans-serif;
  font-size: 0.875rem;
  color: #231A12;
}

.cpn-summary-casher-session__paiement-modes-item-info {
  display: flex;
  flex-direction: column;
  font-size: 0.75rem;
  color: #8f4e00;
  /* color: #564334; */
  gap:0;
}

.cpn-summary-casher-session__reconciliation-inner {
  background-color: #FEEADD;
  border: solid 1px #DCC2AE;
  border-radius: 4px;
  padding: 10px 10px;
}

.cpn-summary-casher-session__reconciliation-title {
  display: flex;
  align-items: center;
  gap: 2px;
  font-family: 'ExoMedium', sans-serif;
  font-size: 0.875rem;
  color: #231A12;
  margin-bottom: 10px;
}

.cpn-summary-casher-session__section-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.cpn-summary-casher-session__section-row-label {
  font-size: 0.75rem;
  color: #564334;
  margin-bottom: 2px;
}

.cpn-summary-casher-session__section-row-value {
  font-family: 'ExoBold', sans-serif;
  font-size: 1rem;
  color: #231A12;
}

.cpn-summary-casher-session input.cpn-field[name="reelValue"] {
  max-width: 150px;
}

.cpn-summary-casher-session textarea.cpn-field {
  height: 80px;
}

.cpn-summary-casher-session .cpn-form__bottom.second-step {
  background-color: #e8e8e8;
}

.cpn-summary-casher-session .cpn-form__bottom.second-step::before {
  content: "";
  display: inline-block;
  position: absolute;
  background-color: #e8e8e8;
  width: calc(100% + 20px);
  height: calc(100% + 10px);
  top: -10px;
  left: -10px;
  
}

/*
-----------------------------------------
| COMPONEMT: cpn-occupied-table
-----------------------------------------
*/
.cpn-occupied-tables {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding: 0 15px 5px;
  gap: 20px;
}

.cpn-occupied-tables__item {
  display: flex;
  flex-direction: column;
  background-color: #ffffff;
  border: solid 1px #FA8D05;
  border-left-width: 6px;
  border-radius: 18px;
  padding: 10px;
  min-width: 265px;
  width: 265px;
  height: 160px;
  box-shadow: 0px 1px 6px 3px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

@media(max-width:981px) {
  .app-cash-desk.is-open-right-sidebar .cpn-occupied-tables__item {
    width: calc(50% - 20px);
    min-width: 240px;
  }
}

@media(max-width:950px) {
 .app-cash-desk.is-open-right-sidebar .cpn-occupied-tables__item {
    width: calc(100% - 10px);
  }
}

@media(max-width:945px) {
  .cpn-occupied-tables__item {
    width: calc(50% - 10px);
  }
}

@media(max-width:669px) {
  .cpn-occupied-tables__item {
    width: calc(100% - 10px);
  }
}

.cpn-occupied-tables__item:hover{
  background-color: #ffefef;
}

.cpn-occupied-tables__item.selected {
  border-color: #15803d;
}

.cpn-occupied-tables__item-head {
  margin-bottom: 15px;
}

.cpn-occupied-tables__item-table {
  font-size: 1rem;
  color: #8F4E00;
  font-family: "ExoBold", sans-serif;
  margin-bottom: 5px;
}

.cpn-occupied-tables__item-actions-btn {
  padding: 5px;
}

.cpn-occupied-tables__item-actions-btn .cpn-icon{
  transform: rotate(90deg);
  background-color: #000;
}
.cpn-occupied-tables__item-row-grp {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
}

.cpn-occupied-tables__item-small-row,
.cpn-occupied-tables__item-row {
  font-size: 0.75rem;
  color: #564334;
  font-family: "ExoMedium", sans-serif;
  display: flex;
  align-items: center;
  gap: 5px;
}

.cpn-occupied-tables__item-small-row.flex--column,
.cpn-occupied-tables__item-row.flex--column {
  flex-direction: column;
  align-items: self-start;
  gap: 0;
}

.cpn-occupied-tables__item-small-row-value {
  font-family: "ExoBold", sans-serif;
}

.cpn-occupied-tables__item-row-icon-wrap {
  display: inline-block;
  width: 12px;
  height: 12px;
}

.cpn-occupied-tables__item-row-icon-wrap .cpn-icon {
  background-color: #8F4E00;
  min-width: 12px;
  min-height: 12px;
  mask-size: 12px 12px;
}

.cpn-occupied-tables__item-body {
  padding-bottom: 10px;
}

.cpn-occupied-tables__item-footer {
  padding: 10px;
  border-top: solid 1px #DCC2AE;
}

.cpn-occupied-tables__item-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "ExoMedium", sans-serif;
}

/*
-----------------------------------------
| COMPONEMT: cpn-menu-categories
-----------------------------------------
*/
.cpn-menu-categories {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

.cpn-menu-categories__list-wrap {
  flex: 1;
  min-height: 0;
}

.cpn-menu-categories__list {
  display: flex;
  flex-direction: column;
  padding: 15px 10px;
  gap: 5px;
}

.cpn-menu-categories__item-btn {
  width: 100%;
  display: flex;
  align-items: center;
  text-align: left;
  padding: 12px 12px;
  border-radius: 4px;
  border-left: solid 4px transparent;
}

.cpn-menu-categories__item-name {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.875rem;
  color: #564334;
}

.cpn-menu-categories__item-btn:hover {
  background-color: #ffffff;
}

.cpn-menu-categories__item.active .cpn-menu-categories__item-btn {
  background-color: #ffffff;
  border-color: #FA8D05;
}

.cpn-menu-categories__item.active .cpn-menu-categories__item-name {
  color: #8F4E00;
  font-family: "ExoBold", sans-serif;
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cpn-menu-categories__empty {
  padding: 15px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.8rem;
  color: #564334;
  text-align: center;
}

.cpn-menu-categories__search {
  padding: 15px 10px 0;
}

.cpn-menu-categories__search .cpn-search-field {
  min-width: 100%;
}

/*
-----------------------------------------
| COMPONEMT: cpn-menu-products
-----------------------------------------
*/
.cpn-menu-products__search {
  width: 240px;
  max-width: 100%;
  flex: 0 1 240px;
}

.cpn-menu-products__search .cpn-field {
  height: 34px;
}

.cpn-menu-products {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding: 0 15px 15px;
  gap: 20px;
}

.cpn-menu-products__empty {
  padding: 15px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.8rem;
  color: #564334;
  text-align: center;
}

.cpn-menu-products__item {
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: #ffffff;
  border-radius: 4px;
  min-width: 200px;
  width: 200px;
  box-shadow: 0px 1px 6px 3px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  cursor: pointer;
}

.cpn-menu-products__item:hover {
  background-color: #fff8f5;
}

/*==>> Responsive: same pattern as .cpn-occupied-tables__item */
@media(max-width:100px) {
  .app-cash-desk.is-open-right-sidebar .cpn-menu-products__item {
    width: calc(50% - 20px);
    min-width: 180px;
  }
}


@media(max-width:981px) {
  .app-cash-desk.is-open-right-sidebar .cpn-menu-products__item {
    width: 100%;
    min-width: 180px;
  }
}

@media(max-width:950px) {
  .app-cash-desk.is-open-right-sidebar .cpn-menu-products__item {
    width: calc(100% - 10px);
  }
}

@media(max-width:945px) {
  .cpn-menu-products__item {
    width: calc(50% - 10px);
  }
}

@media(max-width:726px) {
  .cpn-menu-products__item {
    width: calc(100% - 10px);
  }
}

/*==>> Responsive: less horizontal room once the right (order) sidebar is open */
@media(max-width:1180px) {
  .app-cash-desk.is-open-right-sidebar .app-cash-desk__body-main-left-sidebar {
    width: 150px;
    min-width: 150px;
  }
}

@media(max-width:900px) {
  .app-cash-desk.is-open-right-sidebar .app-cash-desk__body-main-left-sidebar {
    width: 130px;
    min-width: 130px;
  }

  .app-cash-desk.is-open-right-sidebar .cpn-menu-products__search {
    flex-basis: 100%;
  }
}

.cpn-menu-products__item-img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 120px;
  background-color: #f6f1f0;
}

.cpn-menu-products__item-img-wrap>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cpn-menu-products__item-img-wrap>.cpn-icon {
  background-color: #8F4E00;
  min-width: 30px;
  min-height: 30px;
  mask-size: 30px 30px;
}

.cpn-menu-products__item-body {
  padding: 10px;
}

.cpn-menu-products__item-name {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.85rem;
  color: #231A12;
  margin-bottom: 5px;
}

.cpn-menu-products__item-price {
  font-family: "ExoBold", sans-serif;
  font-size: 0.8rem;
  color: #8F4E00;
}

.cpn-menu-products__item-add-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 26px;
  height: 26px;
  min-width: 26px;
  border-radius: 50%;
  background-color: #FA8D05;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cpn-menu-products__item-add-btn .cpn-icon {
  background-color: #ffffff;
  min-width: 12px;
  min-height: 12px;
  mask-size: 12px 12px;
}

/*
-----------------------------------------
| COMPONEMT: cpn-menu-product-details
-----------------------------------------
*/
.cpn-menu-product-details__img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 220px;
  background-color: #f6f1f0;
  border-radius: 4px;
  margin-bottom: 15px;
  overflow: hidden;
}

.cpn-menu-product-details__img-wrap>img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cpn-menu-product-details__img-wrap>.cpn-icon {
  background-color: #8F4E00;
  min-width: 50px;
  min-height: 50px;
  mask-size: 50px 50px;
}

.cpn-menu-product-details__category {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.75rem;
  color: #8F4E00;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.cpn-menu-product-details__name {
  font-family: "ExoMedium", sans-serif;
  font-size: 1.3rem;
  color: #231A12;
  margin-bottom: 8px;
}

.cpn-menu-product-details__meta {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 12px;
}

.cpn-menu-product-details__price {
  font-family: "ExoBold", sans-serif;
  font-size: 1.1rem;
  color: #8F4E00;
}

.cpn-menu-product-details__cooking-time {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: "ExoMedium", sans-serif;
  font-size: 0.85rem;
  color: #564334;
}

.cpn-menu-product-details__cooking-time .cpn-icon {
  background-color: #564334;
  min-width: 14px;
  min-height: 14px;
  mask-size: 14px 14px;
}

.cpn-menu-product-details__description {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
  line-height: 1.4rem;
  margin-bottom: 12px;
}

.cpn-menu-product-details__section-title {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.95rem;
  color: #231A12;
  margin-bottom: 6px;
}

.cpn-menu-product-details__section-empty {
  font-family: "ExoLightItalic", sans-serif;
  font-style: italic;
  font-size: 0.8rem;
  color: #a2a1a1;
}

.cpn-menu-product-details__ingredients {
  border-top: solid 1px #dcc2ae;
  padding-top: 12px;
  margin-bottom: 12px;
}

.cpn-menu-product-details__ingredients-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.cpn-menu-product-details__ingredients-item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
}

.cpn-menu-product-details__ingredients-item-name::before {
  content: "•";
  color: #FA8D05;
  margin-right: 6px;
}

.cpn-menu-product-details__ingredients-item-qty {
  font-family: "ExoMedium", sans-serif;
  white-space: nowrap;
  color: #231A12;
}

.cpn-menu-product-details__recipe {
  border-top: solid 1px #dcc2ae;
  padding-top: 12px;
}

.cpn-menu-product-details__recipe-text {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
  line-height: 1.4rem;
}

/*
-----------------------------------------
| COMPONEMT: cpn-table-history
-----------------------------------------
*/
.cpn-table-history__title {
  font-family: "ExoMedium", sans-serif;
  font-size: 1.2rem;
  color: #231A12;
  margin-bottom: 15px;
}

.cpn-table-history__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 60vh;
}

.cpn-table-history__item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding-bottom: 10px;
  border-bottom: solid 1px #f2e9e3;
}

@media(max-width:985px) {
  .cpn-menu-products__item {
    min-width: calc(50% - 10px);
  }
}

.cpn-table-history__item:last-child {
  border-bottom: none;
}

.cpn-table-history__item-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  min-width: 30px;
  border-radius: 50%;
  background-color: #F2DFD2;
}

.cpn-table-history__item-icon-wrap .cpn-icon {
  background-color: #8F4E00;
}

.cpn-table-history__item--remove .cpn-table-history__item-icon-wrap {
  background-color: #fde2e2;
}

.cpn-table-history__item--remove .cpn-table-history__item-icon-wrap .cpn-icon {
  background-color: #d13a3a;
}

.cpn-table-history__item--decrease .cpn-table-history__item-icon-wrap .cpn-icon {
  background-color: #c66e03;
}

.cpn-table-history__item-body {
  flex: 1;
  min-width: 0;
}

.cpn-table-history__item-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 2px;
}

.cpn-table-history__item-action {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.85rem;
  color: #231A12;
}

.cpn-table-history__item-date {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
  white-space: nowrap;
}

.cpn-table-history__item-product {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.85rem;
  color: #564334;
}

.cpn-table-history__item-reason {
  font-family: "ExoLightItalic", sans-serif;
  font-style: italic;
  font-size: 0.8rem;
  color: #564334;
  margin-top: 2px;
}

.cpn-table-history__item-user {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.75rem;
  color: #8F4E00;
  margin-top: 2px;
}

.cpn-table-history__empty {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
  text-align: center;
  padding: 20px 0;
}

.cpn-table-history__print-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 15px;
  padding-top: 15px;
  border-top: solid 1px #f2e9e3;
}

.cpn-table-history__print-actions .cpn-btn {
  flex: 1;
  gap: 6px;
}

/*
-----------------------------------------
| COMPONEMT: cpn-sales-sessions (left sidebar)
-----------------------------------------
*/
.cpn-sales-sessions {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

.cpn-sales-sessions__list {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  padding: 10px;
  gap: 8px;
}

.cpn-sales-sessions__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  background-color: #ffffff;
  border-left: solid 4px transparent;
  border-radius: 4px;
  padding: 10px;
  cursor: pointer;
  box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.05);
}

.cpn-sales-sessions__item:hover {
  background-color: #fff8f5;
}

.cpn-sales-sessions__item.active {
  border-color: #FA8D05;
}

.cpn-sales-sessions__item-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  font-family: "ExoMedium", sans-serif;
  font-size: 0.8rem;
  color: #231A12;
}

.cpn-sales-sessions__item-status {
  font-family: "ExoBold", sans-serif;
  font-size: 0.65rem;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
  background-color: #f2e9e3;
  color: #564334;
}

.cpn-sales-sessions__item-status.live {
  background-color: #d7f5df;
  color: #15803d;
}

.cpn-sales-sessions__item-status.closed {
  background-color: #f2e9e3;
  color: #564334;
}

.cpn-sales-sessions__item-hours {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
}

.cpn-sales-sessions__item-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  font-family: "ExoMedium", sans-serif;
  font-size: 0.75rem;
  color: #8F4E00;
}

.cpn-sales-sessions__empty {
  padding: 15px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.8rem;
  color: #564334;
  text-align: center;
}

/*
-----------------------------------------
| COMPONEMT: cpn-cashier-waiters (left sidebar — Caisse > Serveurs page)
-----------------------------------------
*/
.cpn-cashier-waiters {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

.cpn-cashier-waiters__list {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  padding: 10px;
  gap: 8px;
  overflow-y: auto;
}

.cpn-cashier-waiters__item {
  border-left: solid 4px transparent;
  border-radius: 4px;
  box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.05);
}

.cpn-cashier-waiters__item.active {
  border-color: #FA8D05;
}

.cpn-cashier-waiters__item-btn {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: #ffffff;
  border-radius: 4px;
  padding: 10px;
  text-align: left;
}

.cpn-cashier-waiters__item.active .cpn-cashier-waiters__item-btn,
.cpn-cashier-waiters__item-btn:hover {
  background-color: #fff8f5;
}

.cpn-cashier-waiters__item-avatar {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 50%;
  background-color: #f2e9e3;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.cpn-cashier-waiters__item-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cpn-cashier-waiters__item-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.cpn-cashier-waiters__item-name {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.85rem;
  color: #231A12;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cpn-cashier-waiters__item-meta {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
}

.cpn-cashier-waiters__empty {
  padding: 15px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.8rem;
  color: #564334;
  text-align: center;
}

/*
-----------------------------------------
| COMPONEMT: cpn-cashier-waiter-tables (main content — tables d'un serveur, groupées par statut)
-----------------------------------------
*/
.cpn-cashier-waiter-tables {
  padding: 0 15px 15px;
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.cpn-cashier-waiter-tables__group-title {
  font-family: "ExoBold", sans-serif;
  font-size: 0.9rem;
  color: #564334;
  margin-bottom: 12px;
}

.cpn-cashier-waiter-tables__group-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
}

.cpn-cashier-waiter-tables__card {
  width: 100%;
  text-align: left;
  cursor: pointer;
  border-radius: 0.75rem;
  border: solid 1px #dcc2ae;
  background-color: #fff;
  padding: 14px 16px;
  border-left: solid 4px transparent;
}

.cpn-cashier-waiter-tables__card:hover {
  border-color: #ff8c00;
}

.cpn-cashier-waiter-tables__card--pending {
  border-left-color: #ff8c00;
}

.cpn-cashier-waiter-tables__card--ready {
  border-left-color: #FA8D05;
}

.cpn-cashier-waiter-tables__card--valid {
  border-left-color: #15803d;
}

.cpn-cashier-waiter-tables__card--invalid {
  border-left-color: #dc2626;
  opacity: 0.7;
}

.cpn-cashier-waiter-tables__card-table {
  font-family: "ExoBold", sans-serif;
  color: #8F4E00;
}

.cpn-cashier-waiter-tables__card-total {
  font-family: "ExoMedium", sans-serif;
  color: #231A12;
  margin-top: 4px;
}

.cpn-cashier-waiter-tables__card-date {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
  margin-top: 4px;
}

/*
-----------------------------------------
| COMPONEMT: cpn-sales-detail (main content)
-----------------------------------------
*/
.cpn-sales-detail__empty {
  padding: 30px 15px;
  text-align: center;
  font-family: "ExoRegular", sans-serif;
  color: #564334;
}

.cpn-sales-detail__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  padding: 0 15px 15px;
}

.cpn-sales-detail__summary-card {
  flex: 1;
  min-width: 150px;
  background-color: #ffffff;
  border-radius: 4px;
  padding: 12px 15px;
  box-shadow: 0px 1px 6px 3px rgba(0, 0, 0, 0.05);
}

.cpn-sales-detail__summary-label {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
  margin-bottom: 4px;
}

.cpn-sales-detail__summary-value {
  font-family: "ExoBold", sans-serif;
  font-size: 1.1rem;
  color: #231A12;
}

.cpn-sales-detail__meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 0 15px 15px;
}

.cpn-sales-detail__meta-row .cpn-sales-detail__meta {
  padding: 0;
}

.cpn-sales-detail__print-btn {
  flex-shrink: 0;
}

.cpn-sales-detail__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  padding: 0 15px 15px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.8rem;
  color: #564334;
}

.cpn-sales-detail__meta > div {
  display: flex;
  gap: 5px;
}

.cpn-sales-detail__meta > div > span:first-child {
  color: #a2a1a1;
}

.cpn-sales-detail__orders {
  padding: 0 15px 15px;
}

.cpn-sales-detail__orders-title {
  font-family: "ExoMedium", sans-serif;
  font-size: 1rem;
  color: #231A12;
  margin-bottom: 10px;
}

.cpn-filter-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.cpn-filter-field__label {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.7rem;
  color: #a2a1a1;
}

/* Reusable search field (magnifying glass icon + minimum width) — wrap a type="search" input in
   this, inside a .cpn-filter-field alongside its label, wherever a search box is added. */
.cpn-search-field {
  position: relative;
  min-width: 230px;
}

.cpn-search-field .cpn-field {
  padding-left: 34px;
  margin-bottom: 0;
}

.cpn-search-field .cpn-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  background-color: #a2a1a1;
  pointer-events: none;
}

.cpn-sales-detail__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.cpn-sales-detail__filters .cpn-field {
  width: auto;
  min-width: 160px;
}

.cpn-sales-detail__orders-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cpn-sales-detail__order-row {
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: #ffffff;
  border: solid 1px #dcc2ae;
  border-radius: 4px;
  padding: 10px 12px;
  box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.05);
}

.cpn-sales-detail__order-row--invalid {
  background-color: #fdf2f2;
  border-color: #f3c6c6;
}

.cpn-sales-detail__order-row-status {
  display: inline-block;
  font-family: "ExoBold", sans-serif;
  font-size: 0.65rem;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
  margin-left: 6px;
}

.cpn-sales-detail__order-row-status.valid {
  background-color: #d7f5df;
  color: #15803d;
}

.cpn-sales-detail__order-row-status.invalid {
  background-color: #fde2e2;
  color: #d13a3a;
}

.cpn-sales-detail__order-row-status.pending {
  background-color: #fdeecb;
  color: #c66e03;
}

.cpn-sales-detail__order-row--pending {
  background-color: #fffaf0;
  border-color: #f3dfa8;
}

.cpn-sales-detail__order-row-main {
  flex: 1;
  min-width: 0;
}

.cpn-sales-detail__order-row-table {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.875rem;
  color: #231A12;
}

.cpn-sales-detail__order-row-meta {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
}

.cpn-sales-detail__order-row-rejection {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #d13a3a;
  margin-top: 4px;
}

.cpn-sales-detail__order-row-total {
  font-family: "ExoBold", sans-serif;
  font-size: 0.875rem;
  color: #8F4E00;
  white-space: nowrap;
}

.cpn-sales-detail__order-row-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

/*
-----------------------------------------
| COMPONEMT: cpn-finance-box-info
-----------------------------------------
*/
.cpn-finance-box-info {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 0 15px 15px;
  padding: 15px;
  background-color: #ffffff;
  border-radius: 4px;
  box-shadow: 0px 1px 6px 3px rgba(0, 0, 0, 0.05);
}

.cpn-finance-box-info__icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  flex-shrink: 0;
  border-radius: 50%;
  background-color: #fdf1e7;
  color: #8F4E00;
}

.cpn-finance-box-info__main {
  flex: 1;
  min-width: 0;
}

.cpn-finance-box-info__top {
  display: flex;
  align-items: center;
  gap: 8px;
}

.cpn-finance-box-info__name {
  font-family: "ExoMedium", sans-serif;
  font-size: 1rem;
  color: #231A12;
}

.cpn-finance-box-info__status {
  display: inline-block;
  font-family: "ExoBold", sans-serif;
  font-size: 0.65rem;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
}

.cpn-finance-box-info__status.open {
  background-color: #d7f5df;
  color: #15803d;
}

.cpn-finance-box-info__status.closed {
  background-color: #fde2e2;
  color: #d13a3a;
}

.cpn-finance-box-info__balance-label {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
  margin-top: 4px;
}

.cpn-finance-box-info__balance-value {
  font-family: "ExoBold", sans-serif;
  font-size: 1.25rem;
  color: #8F4E00;
}

.cpn-finance-box-info__actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

/*
-----------------------------------------
| COMPONEMT: cpn-finance-history
-----------------------------------------
*/
.cpn-finance-history {
  padding: 0 15px 15px;
}

.cpn-finance-history__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.cpn-finance-history__filters .cpn-field {
  width: auto;
  min-width: 160px;
}

.cpn-finance-history__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cpn-finance-history__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background-color: #ffffff;
  border: solid 1px #dcc2ae;
  border-radius: 4px;
  padding: 10px 12px;
  box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.05);
}

.cpn-finance-history__row-main {
  flex: 1;
  min-width: 0;
}

.cpn-finance-history__row-top {
  display: flex;
  align-items: center;
}

.cpn-finance-history__row-category {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.875rem;
  color: #231A12;
}

.cpn-finance-history__row-badge {
  display: inline-block;
  font-family: "ExoBold", sans-serif;
  font-size: 0.65rem;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
  margin-left: 6px;
}

.cpn-finance-history__row-badge.in {
  background-color: #d7f5df;
  color: #15803d;
}

.cpn-finance-history__row-badge.out {
  background-color: #fde2e2;
  color: #d13a3a;
}

.cpn-finance-history__row-badge.withdraw {
  background-color: #fdeecb;
  color: #c66e03;
}

.cpn-finance-history__row-badge.pending {
  background-color: #eeeeee;
  color: #6b6b6b;
  margin-left: 6px;
}

.cpn-finance-history__row-meta {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
}

.cpn-finance-history__row-comment {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #6b6b6b;
  margin-top: 4px;
}

.cpn-finance-history__row-amount {
  font-family: "ExoBold", sans-serif;
  font-size: 0.875rem;
  white-space: nowrap;
}

.cpn-finance-history__row-amount.in {
  color: #15803d;
}

.cpn-finance-history__row-amount.out,
.cpn-finance-history__row-amount.withdraw {
  color: #d13a3a;
}

/*
-----------------------------------------
| COMPONEMT: cpn-clients
-----------------------------------------
*/
.cpn-clients__top {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 15px 15px;
}

.cpn-clients__top .cpn-search-field {
  flex: 1;
}

.cpn-clients__results {
  padding: 0 15px 15px;
}

.cpn-clients__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cpn-clients__card {
  display: flex;
  align-items: center;
  gap: 12px;
  background-color: #ffffff;
  border: solid 1px #dcc2ae;
  border-radius: 4px;
  padding: 10px 12px;
  box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.05);
  cursor: pointer;
}

.cpn-clients__card:hover {
  border-color: #8F4E00;
}

.cpn-clients__card-top {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.cpn-clients__card-status,
.cpn-clients__card-type {
  display: inline-block;
  font-family: "ExoBold", sans-serif;
  font-size: 0.65rem;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
}

.cpn-clients__card-status.active {
  background-color: #d7f5df;
  color: #15803d;
}

.cpn-clients__card-status.inactive {
  background-color: #fde2e2;
  color: #d13a3a;
}

.cpn-clients__card-type {
  background-color: #e6edfd;
  color: #2451c7;
}

.cpn-clients__card-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 50%;
  background-color: #fdf1e7;
  color: #8F4E00;
}

.cpn-clients__card-main {
  flex: 1;
  min-width: 0;
}

.cpn-clients__card-name {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.875rem;
  color: #231A12;
}

.cpn-clients__card-meta {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.75rem;
  color: #a2a1a1;
}

.cpn-clients__card-stats {
  display: flex;
  gap: 15px;
}

.cpn-clients__card-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cpn-clients__card-stat span {
  font-family: "ExoBold", sans-serif;
  font-size: 0.875rem;
  color: #8F4E00;
}

.cpn-clients__card-stat small {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.65rem;
  color: #a2a1a1;
}

.cpn-clients-detail__back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: auto;
  margin: 15px 15px 0;
  padding: 0;
  background: transparent;
  border: none;
  color: #8F4E00;
  font-family: "ExoMedium", sans-serif;
  font-size: 0.85rem;
  cursor: pointer;
}

.cpn-clients-detail__back:hover {
  text-decoration: underline;
}

.cpn-clients-detail__back .cpn-icon {
  background-color: #8F4E00;
}

.cpn-clients-detail-layout {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 15px;
  margin: 0 15px 15px;
}

.cpn-clients-detail-left {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 320px;
  min-width: 280px;
  flex-shrink: 0;
}

.cpn-clients-detail {
  background-color: #ffffff;
  border-radius: 4px;
  box-shadow: 0px 1px 6px 3px rgba(0, 0, 0, 0.05);
  padding: 15px;
}

.cpn-clients-detail__recharge-btn {
  width: 100%;
}

.cpn-clients-detail__header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 15px;
}

.cpn-clients-detail__avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  flex-shrink: 0;
  border-radius: 50%;
  background-color: #fdf1e7;
  color: #8F4E00;
}

.cpn-clients-detail__name {
  font-family: "ExoMedium", sans-serif;
  font-size: 1.1rem;
  color: #231A12;
  margin-bottom: 6px;
}

.cpn-clients-detail__badges {
  display: flex;
  gap: 6px;
}

.cpn-clients-detail__stats {
  display: flex;
  gap: 15px;
  padding: 12px 0;
  border-top: solid 1px #f0e6dd;
  border-bottom: solid 1px #f0e6dd;
  margin-bottom: 15px;
}

.cpn-clients-detail__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
}

.cpn-clients-detail__stat span {
  font-family: "ExoBold", sans-serif;
  font-size: 1rem;
  color: #8F4E00;
}

.cpn-clients-detail__stat small {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.7rem;
  color: #a2a1a1;
}

.cpn-clients-detail__info-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  border-bottom: solid 1px #f7f2ee;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.85rem;
}

.cpn-clients-detail__info-row:last-child {
  border-bottom: none;
}

.cpn-clients-detail__info-row > span:first-child {
  color: #a2a1a1;
}

.cpn-clients-detail__info-row > span:last-child {
  color: #231A12;
  text-align: right;
}

.cpn-clients-detail-tabs {
  flex: 1;
  min-width: 380px;
  background-color: #ffffff;
  border-radius: 4px;
  box-shadow: 0px 1px 6px 3px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  align-self: stretch;
}

.cpn-clients-detail-tabs__nav {
  display: flex;
  border-bottom: solid 1px #f0e6dd;
}

.cpn-clients-detail-tabs__btn {
  flex: 1;
  background: transparent;
  border: none;
  padding: 12px;
  font-family: "ExoMedium", sans-serif;
  font-size: 0.85rem;
  color: #a2a1a1;
  cursor: pointer;
  border-bottom: solid 2px transparent;
}

.cpn-clients-detail-tabs__btn.active {
  color: #8F4E00;
  border-bottom-color: #8F4E00;
}

.cpn-clients-detail-tabs__content {
  padding: 15px;
}

.cpn-clients-detail-tabs__note {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.7rem;
  color: #a2a1a1;
  margin-top: 4px;
}

.cpn-clients-detail-tabs__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.cpn-clients-detail-tabs__actions .cpn-clients-detail-tabs__note {
  margin-top: 0;
}

.cpn-clients-detail-tabs__credit-access {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}

.cpn-clients-detail-tabs__credit-access .cpn-clients-detail-tabs__note {
  margin-top: 0;
}

/*
-----------------------------------------
| COMPONEMT: cpn-order-detail-modal
-----------------------------------------
*/
.cpn-order-detail-modal__title {
  font-family: "ExoMedium", sans-serif;
  font-size: 1.2rem;
  color: #231A12;
  margin-bottom: 10px;
}

.cpn-order-detail-modal__meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-bottom: 15px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.8rem;
  color: #564334;
}

.cpn-order-detail-modal__meta > div {
  display: flex;
  justify-content: space-between;
}

.cpn-order-detail-modal__meta > div > span:first-child {
  color: #a2a1a1;
}

.cpn-order-detail-modal__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
  margin-bottom: 12px;
}

.cpn-order-detail-modal__table th {
  text-align: left;
  font-family: "ExoMedium", sans-serif;
  color: #564334;
  border-bottom: solid 1px #dcc2ae;
  padding: 4px 6px;
}

.cpn-order-detail-modal__table td {
  padding: 4px 6px;
  border-bottom: solid 1px #f2e9e3;
  color: #231A12;
}

.cpn-order-detail-modal__totals {
  margin-bottom: 12px;
}

.cpn-order-detail-modal__totals > div {
  display: flex;
  justify-content: space-between;
  font-size: 0.85rem;
  color: #564334;
  padding: 2px 0;
}

.cpn-order-detail-modal__totals-grand {
  border-top: solid 1px #dcc2ae;
  margin-top: 5px;
  padding-top: 6px !important;
  font-weight: bold;
  color: #231A12 !important;
}

.cpn-order-detail-modal__section-title {
  font-family: "ExoMedium", sans-serif;
  font-size: 0.875rem;
  color: #231A12;
  margin-bottom: 6px;
}

.cpn-order-detail-modal__payments {
  margin-bottom: 12px;
}

.cpn-order-detail-modal__payments > div {
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  color: #564334;
  padding: 2px 0;
}

.cpn-order-detail-modal__history {
  max-height: 150px;
}

.cpn-order-detail-modal__history-item {
  font-size: 0.75rem;
  color: #564334;
  padding: 3px 0;
  border-bottom: solid 1px #f2e9e3;
}

.cpn-order-detail-modal__print-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}

.cpn-order-detail-modal__print-actions .cpn-btn {
  flex: 1;
  gap: 6px;
}

/*
-----------------------------------------
| COMPONEMT: cpn-invoice-print-modal
-----------------------------------------
*/
.cpn-invoice-print-modal__title {
  font-family: "ExoMedium", sans-serif;
  font-size: 1.2rem;
  color: #231A12;
  margin-bottom: 15px;
}

.cpn-invoice-print-modal__summary {
  border: solid 1px #f2e9e3;
  border-radius: 4px;
  padding: 10px 12px;
  margin-bottom: 15px;
}

.cpn-invoice-print-modal__summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
  padding: 3px 0;
}

.cpn-invoice-print-modal__checkbox-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
  margin-bottom: 15px;
  cursor: pointer;
}

.cpn-invoice-print-modal__checkbox-row input[type="checkbox"] {
  width: auto;
  height: auto;
  cursor: pointer;
}

.cpn-invoice-print-modal__print-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
}

.cpn-invoice-print-modal__print-actions .cpn-btn {
  flex: 1;
  gap: 6px;
}

/*
-----------------------------------------
| COMPONEMT: cpn-closing-report-print-modal
-----------------------------------------
*/
.cpn-closing-report-print-modal__title {
  font-family: "ExoMedium", sans-serif;
  font-size: 1.2rem;
  color: #231A12;
  margin-bottom: 15px;
}

.cpn-closing-report-print-modal__summary {
  border: solid 1px #f2e9e3;
  border-radius: 4px;
  padding: 10px 12px;
  margin-bottom: 15px;
}

.cpn-closing-report-print-modal__summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
  padding: 3px 0;
}

.cpn-closing-report-print-modal p {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.875rem;
  color: #564334;
  margin-bottom: 15px;
}

.cpn-closing-report-print-modal__print-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
}

.cpn-closing-report-print-modal__print-actions .cpn-btn {
  flex: 1;
  gap: 6px;
}

/*
-----------------------------------------
| COMPONENT: cpn-switch (generic on/off toggle — status changes, activation flags...)
-----------------------------------------
*/
.cpn-switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 24px;
  min-width: 42px;
}

.cpn-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.cpn-switch__slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #dcc2ae;
  transition: 0.2s;
  border-radius: 24px;
}

.cpn-switch__slider::before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background-color: #ffffff;
  transition: 0.2s;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.cpn-switch input:checked + .cpn-switch__slider {
  background-color: #15803d;
}

.cpn-switch input:checked + .cpn-switch__slider::before {
  transform: translateX(18px);
}

.cpn-switch input:disabled + .cpn-switch__slider {
  opacity: 0.5;
  cursor: not-allowed;
}

/*
-----------------------------------------
| COMPONEMT: cpn-user-profile-modal
-----------------------------------------
*/
.cpn-user-profile-modal {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cpn-user-profile-modal__avatar-wrap {
  position: relative;
  margin-bottom: 12px;
}

.cpn-user-profile-modal__avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-color: #fdf1e7;
  color: #8F4E00;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.cpn-user-profile-modal__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cpn-user-profile-modal__avatar-edit-btn {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background-color: #8F4E00;
  border: solid 2px #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.cpn-user-profile-modal__avatar-edit-btn .cpn-icon {
  background-color: #fff;
}

/* The global `input{display:block;...}` reset (ui.css) beats the native [hidden] attribute
   on any plain <input> — same technique already used for input[type="file"].cpn-field */
.cpn-user-profile-modal__avatar-edit-btn input[type="file"] {
  width: 0;
  height: 0;
  overflow: hidden;
  position: absolute;
  z-index: -5;
  visibility: hidden;
}

.cpn-user-profile-modal__avatar-edit-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.cpn-user-profile-modal__name {
  font-family: "ExoMedium", sans-serif;
  font-size: 1.1rem;
  color: #231A12;
  margin-bottom: 8px;
}

.cpn-user-profile-modal__badges {
  display: flex;
  gap: 6px;
  margin-bottom: 20px;
}

.cpn-user-profile-modal .cpn-btn {
  width: 100%;
  margin-bottom: 10px;
}

.cpn-user-profile-modal__password-form {
  width: 100%;
}

.cpn-user-profile-modal button[data-action="logout"] {
  color: #fff;
}

.cpn-user-profile-modal button[data-action="logout"] .cpn-icon {
  background-color: #fff;
}

/*
-----------------------------------------
| COMPONEMT: cpn-assign-waiter-to-table-modal
-----------------------------------------
*/

.cpn-assign-waiter-to-table-modal__section .cpn-form__row .cpn-form__row {
  margin-bottom: 0;
}

/*
-----------------------------------------
| COMPONEMT: cpn-table-add-client
-----------------------------------------
*/

.cpn-table-add-client__olds-title {
  font-family: "ExoBold", sans-serif;
  font-size: 1rem;
  margin-bottom: 15px;
  color: #564334;
  text-transform: uppercase;
  display: flex;
  align-items: center;
}

.cpn-table-add-client__olds-title-result {
  margin-left: auto;
  font-size: 0.75rem;
  color: #757575;
}

.cpn-table-add-client__olds-list {
  margin-bottom: 10px;
  max-height: 250px;
}

.cpn-table-add-client__olds-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #DCC2AE;
  border-radius: 8px;
  padding: 16px;
  background-color: #fff;
  margin-bottom: 8px;
}

.cpn-table-add-client__olds-item-left {
  display: flex;
  align-items: center;
  gap: 15px;
}

.cpn-table-add-client__olds-item-avatar-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: rgba(143, 78, 0, 0.1);
  border-radius: 50%;
}

.cpn-table-add-client__olds-item-avatar-wrap .cpn-icon {
  background-color: #8F4E00;
}

.cpn-table-add-client__olds-client-name {
  font-size: 1rem;
  color: #231A12;
}

.cpn-table-add-client__olds-client-pts {
  font-size: 0.75rem;
  color: #564334;
}

.cpn-table-add-client__olds-item-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  font-size: 0.875rem;
  color: #8F4E00;
  border: solid 1px #8F4E00;
  padding: 6px 20px;
}

.cpn-table-add-client__olds-item-btn:hover {
  background-color: #8F4E00;
  color: #fff;
}

.cpn-table-add-client__new-btn {
  max-width: 100%;
  gap: 8px;
  border-radius: 8px;
  margin-bottom: 10px;
}


/*
-----------------------------------------
| COMPONEMT: cpn-order-payment
-----------------------------------------
*/

.cpn-order-payment__section {
  max-width: 500px;
  margin: 0 auto 15px;
}
.cpn-order-payment__section-title {
  font-size: 1rem;
  margin-bottom: 10px;
  font-family: "ExoRegular", sans-serif;
  color: #231A12;
}

.cpn-order-payment__section-block:not(:last-child) {
  border-bottom: solid 1px #DCC2AE;
  padding-bottom: 10px;
}

.cpn-order-payment__methods-list {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 15px;
  background-color: #fff;
  box-shadow: 0px 0px 3px 1px #00000017;
  border-radius: 8px;
}

.cpn-order-payment__methods-list-item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  width: 110px;
  height: 80px;
  background-color: #ffebe3;
  border-radius: 8px;
  border: 1px solid #DCC2AE;
  cursor: pointer;
  font-size: 0.75rem;
  color: #231A12;
}

.cpn-order-payment__methods-list-item>svg {
  width: 22px;
  height: 22px;
}

.cpn-order-payment__methods-list-item>svg>path {
  fill: #231A12;
}

.cpn-order-payment__methods-list-item:hover {
  border: 1px solid #ff8c00;
  color: #ff8c00;
}

.cpn-order-payment__methods-list-item:hover>svg>path {
  fill: #ff8c00;
}

.cpn-order-payment__methods-list-item.selected {
  background-color: #ff8c00;
  border-color: #ff8c00;
  color: #fff;
}

.cpn-order-payment__methods-list-item.selected>svg>path {
  fill: #fff;
}

.cpn-order-payment__details {
  padding: 10px;
  background-color: #FFF1E8;
  border: solid 1px #DCC2AE;
  border-radius: 12px;
}

.cpn-order-payment__details .cpn-field {
  border-color: #DCC2AE;
}

.cpn-order-payment__details-amount-options {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 15px
}


.cpn-order-payment__details-amount-options-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 30px;
  background-color: #FFF8F5;
  border: 1px solid #DCC2AE;
  border-radius: 4px;
  font-size: 0.675rem;
  color: #231A12;
  cursor: pointer;
}

.cpn-order-payment__details-amount-options-item:hover {
  background-color: #ff8c00;
  border-color: #ff8c00;
  color: #fff;
}

.cpn-order-payment__details .cpn-order-payment__section-block:first-child {
  margin-bottom: 10px;
}

.cpn-order-payment__section-block-title {
  font-size: 0.875rem;
  color: #231A12;
  margin-bottom: 8px;
}

.cpn-order-payment__selected-list-item {
  display: flex;
  align-items: center;
  background-color: #FFF8F5;
  border: 1px solid #DCC2AE;
  border-radius: 4px;
  min-height: 50px;
  color: #231A12;
  font-size: 0.875rem;
  padding: 8px 8px;
  gap: 5px;
  margin-bottom: 8px;
  cursor: pointer;
}

.cpn-order-payment__selected-list-item.active {
  border-color: #FA8D05;
  background-color: #FFF1E0;
}

.cpn-order-payment__selected-list-item-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

.cpn-order-payment__selected-list-item-icon-wrap>.cpn-icon {
  background-color: #8F4E00;
}

.cpn-order-payment__selected-list-item-icon-wrap>svg {
  width: 16px;
  height: 16px;
}

.cpn-order-payment__selected-list-item-amount {
  margin-left: auto;
  color: #231A12;
}

.cpn-order-payment__selected-list-item-delete-btn>.cpn-icon {
  background-color: #BA1A1A;
}

.cpn-order-payment__selected-list-empty {
  font-family: "ExoRegular", sans-serif;
  font-size: 0.8rem;
  color: #a2a1a1;
  text-align: center;
  padding: 10px 0;
}

.cpn-order-payment__bottom-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.875rem;
  color: #564334;
  padding: 5px 0;
}

.cpn-order-payment__bottom-reliquat {
  height: 60px;
  background-color: #00B4F4;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  font-size: 0.75rem;
  color: #00425D;
}

.cpn-order-payment__bottom-reliquat-label {
  font-size: 0.875rem;
}

.cpn-order-payment__bottom-reliquat-value {
  font-size: 1.4rem;
}

.cpn-order-payment__validate-btn {
  font-family: "ExoBold", sans-serif;
  font-size: 1.2rem;
}