/* Ciuchatek 3.35 — przebudowana obsługa klientów */
.clients-page .clients-page-switch,
.clients-page .clients-module-toolbar .toolbar-actions,
.birthday-reminder-backdrop { display: none !important; }

.clients-primary-navigation-v335,
.clients-primary-navigation {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  padding: 5px;
  border: 1px solid #d6e3f2;
  border-radius: 14px;
  background: #f7faff;
}
.clients-primary-navigation-v335 button,
.clients-primary-navigation button {
  flex: 0 0 auto;
  min-height: 42px;
  padding: 9px 15px;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #244467 !important;
  box-shadow: none !important;
  font-weight: 800;
}
.clients-primary-navigation-v335 button:hover,
.clients-primary-navigation button:hover { background: #eaf3ff !important; }
.clients-primary-navigation-v335 button.active,
.clients-primary-navigation button.active {
  color: #fff !important;
  background: linear-gradient(135deg,#0a66ea,#0758d3) !important;
  box-shadow: 0 7px 17px rgba(7,88,211,.2) !important;
}

.clients-workspace.v335-client-open { grid-template-columns: minmax(0,1fr) !important; }
.clients-workspace.v335-client-open > .clients-list-panel { display: none !important; }
.clients-workspace.v335-client-open > .client-detail-panel { min-height: 620px; }
.client-detail-header .v335-show-list { margin-left: auto; align-self: center; white-space: nowrap; }
.client-quick-action.danger { border-color: #efb7b1 !important; background: #fff6f5 !important; color: #98271e !important; }
.client-quick-action.danger strong,.client-quick-action.danger span { color: inherit !important; }
.client-tabs button:is(:nth-child(3)) { }
.v335-eligible-coupons { margin-top: 14px; padding: 16px; border: 1px solid #d8e4f2; border-radius: 14px; background: #fbfdff; }

.v335-modal-backdrop {
  position: fixed; inset: 0; z-index: 100500; display: grid; place-items: center;
  padding: 18px; background: rgba(13,25,43,.62); backdrop-filter: blur(3px);
}
.v335-modal {
  width: min(860px,100%); max-height: calc(100dvh - 36px); overflow: auto;
  padding: 18px; border: 1px solid #d7e3f1; border-radius: 18px; background: #fff;
  box-shadow: 0 28px 80px rgba(9,24,46,.3);
}
.v335-modal > header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:14px; border-bottom:1px solid #e4ebf4; }
.v335-modal > header h3 { margin:0 0 4px; }
.v335-modal > header span { color:#60738c; }
.v335-birthday-list { display:grid; gap:10px; padding-top:14px; }
.v335-birthday-list article { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px; border:1px solid #d9e5f3; border-radius:13px; background:#f8fbff; }
.v335-birthday-list article > div:first-child { display:grid; gap:3px; }
.v335-birthday-list article span,.v335-birthday-list article small { color:#5a6f89; }
.v335-birthday-list .actions { display:flex; flex-wrap:wrap; gap:8px; }

.v335-edit-modal { width:min(940px,100%); }
.v335-edit-modal form { display:grid; gap:15px; padding-top:15px; }
.v335-edit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.v335-edit-grid label,.v335-edit-grid fieldset,.v335-card-field { display:grid; align-content:start; gap:6px; min-width:0; }
.v335-edit-grid label,.v335-card-field > span,.v335-edit-grid legend { color:#17345c; font-weight:800; }
.v335-edit-grid .wide { grid-column:1/-1; }
.v335-edit-grid fieldset { margin:0; padding:10px 12px 12px; border:1px solid #d6e2f0; border-radius:12px; }
.v335-birthday-fields,.v335-card-field > div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.v335-card-field > div { grid-template-columns:minmax(0,1fr) auto; }
.v335-edit-grid small,.v335-card-field small { color:#647891; font-weight:500; }
.v335-consents { display:flex; flex-wrap:wrap; gap:9px; }
.v335-consents label { display:flex; align-items:center; gap:8px; min-height:44px; padding:9px 12px; border:1px solid #d6e2f0; border-radius:11px; background:#f8fbff; }
.v335-verification-box { display:grid; gap:10px; padding:18px; border:1px solid #cfe0f5; border-radius:14px; background:#f5f9ff; }
.v335-verification-box input { max-width:360px; font-size:1.25rem; letter-spacing:.16em; text-align:center; }
.v335-form-message:empty { display:none; }
.v335-flash { position:sticky; top:8px; z-index:80; }

@media (max-width: 780px) {
  .clients-page-header { align-items:stretch !important; }
  .clients-primary-navigation-v335,.clients-primary-navigation { width:100%; }
  .v335-edit-grid { grid-template-columns:1fr; }
  .v335-edit-grid .wide { grid-column:auto; }
  .v335-birthday-list article { align-items:stretch; flex-direction:column; }
  .v335-birthday-list .actions button { flex:1; }
  .client-detail-header { align-items:stretch !important; flex-wrap:wrap; }
  .client-detail-header .v335-show-list { width:100%; margin-left:0; }
}

/* Ciuchatek 3.36 — karta klienta jako modal oraz kafelki postępu kuponów */
html.v336-client-modal-lock,
html.v336-client-modal-lock body { overflow: hidden !important; }

.clients-workspace,
.clients-workspace.v336-client-open {
  grid-template-columns: minmax(0, 1fr) !important;
}
.clients-workspace.v336-client-open > .clients-list-panel,
.clients-workspace > .clients-list-panel {
  display: block !important;
}
.clients-workspace > .client-detail-panel:not(.v336-client-modal-open) {
  display: none !important;
}
.v335-show-list { display: none !important; }

.v336-client-shade {
  position: fixed;
  inset: 0;
  z-index: 100300;
  background: rgba(13, 25, 43, .64);
  backdrop-filter: blur(3px);
}
.client-detail-panel.v336-client-modal-open {
  position: fixed !important;
  z-index: 100400 !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: min(1180px, calc(100vw - 36px)) !important;
  max-width: none !important;
  max-height: calc(100dvh - 36px) !important;
  min-height: min(680px, calc(100dvh - 36px)) !important;
  margin: 0 !important;
  overflow: auto !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 20px !important;
  box-shadow: 0 30px 90px rgba(7, 20, 39, .38) !important;
  overscroll-behavior: contain;
}
.client-detail-panel.v336-client-modal-open .client-detail-header {
  position: sticky;
  top: -1px;
  z-index: 45;
  padding: 4px 2px 13px;
  background: var(--panel-surface, #fff);
  border-bottom: 1px solid var(--panel-line, #dbe5f1);
}
.v336-client-close {
  flex: 0 0 42px !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  margin-left: 8px !important;
  font-size: 1.45rem !important;
}

.v336-coupon-progress {
  margin-top: 14px;
  padding: 16px;
  border: 1px solid #d8e4f2;
  border-radius: 14px;
  background: #fbfdff;
}
.v336-coupon-progress .eligible-coupon-grid,
.client-overview-coupons .eligible-coupon-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)) !important;
  gap: 12px !important;
}
.eligible-coupon-card {
  display: grid !important;
  align-content: start !important;
  gap: 11px !important;
  min-height: 190px;
  padding: 16px !important;
  border-radius: 16px !important;
}
.eligible-coupon-card.available {
  border: 1px solid #9ec8fa !important;
  background: linear-gradient(145deg, #f8fbff, #eef6ff) !important;
  box-shadow: 0 8px 22px rgba(7, 88, 211, .10) !important;
}
.eligible-coupon-card.locked {
  border: 1px solid #d8e0ea !important;
  background: #f3f5f8 !important;
  box-shadow: none !important;
}
.eligible-coupon-card.locked .eligible-coupon-value,
.eligible-coupon-card.locked h4 { color: #52647a !important; }
.eligible-coupon-card.locked p,
.eligible-coupon-card.locked .eligible-coupon-footer span { color: #6f7f92 !important; }
.eligible-coupon-footer { margin-top: auto !important; }

@media (max-width: 760px) {
  .client-detail-panel.v336-client-modal-open {
    width: calc(100vw - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    min-height: 0 !important;
    border-radius: 16px !important;
  }
  .v336-client-close {
    position: absolute;
    top: 6px;
    right: 6px;
  }
  .client-detail-panel.v336-client-modal-open .client-detail-header {
    padding-right: 54px;
  }
  .v336-coupon-progress .eligible-coupon-grid,
  .client-overview-coupons .eligible-coupon-grid {
    grid-template-columns: 1fr !important;
  }
}


/* 3.37 — lista klientów: wyraźna interakcja kliknięcia i dwukliku */
.clients-list .client-list-item { cursor: pointer; user-select: none; }
.clients-list .client-list-item:active { transform: translateY(1px); }