* {
  box-sizing: border-box;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

body {
  margin: 0;
  background: linear-gradient(135deg, #0d6efd, #001c44);
  min-height: 100vh;
}

.login-container {
  width: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.card {
  background: #ffffff;
  border-radius: 14px;
  padding: 32px 28px;
  box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}

h1 {
  margin: 0;
  text-align: center;
  font-size: 26px;
  color: #0d6efd;
}

.subtitle {
  text-align: center;
  color: #666;
  margin-bottom: 24px;
}

input {
  width: 100%;
  padding: 14px;
  margin-bottom: 14px;
  border-radius: 10px;
  border: 1px solid #ddd;
  font-size: 15px;
}

input:focus {
  outline: none;
  border-color: #0d6efd;
}

button {
  width: 100%;
  padding: 14px;
  background: #0d6efd;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 16px;
  cursor: pointer;
}

button:hover {
  background: #0b5ed7;
}

.error {
  margin-top: 12px;
  color: #d9534f;
  text-align: center;
  font-size: 14px;
}


/* Shared admin top bar */
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.topbar .title h1 {
  margin: 0;
  font-size: 26px;
  line-height: 1.1;
}

.topbar .subtitle {
  opacity: 0.85;
  margin-top: 6px;
  font-size: 14px;
  word-break: break-word;
}

.nav {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
}

.nav a {
  text-decoration: none;
}

.nav button {
  width: auto;
  padding: 10px 14px;
  border-radius: 10px;
}

/* Tables: allow horizontal scroll on small screens */
.table-wrap {
  overflow: auto;
  margin-top: 14px;
  -webkit-overflow-scrolling: touch;
}

/* ------------------------------------------------------------------ */
/* CLIENTS – ROW STATUS COLORS (A1: no opacity fading)                  */
/* ------------------------------------------------------------------ */
tr.row-status-active {
  background: rgba(25, 135, 84, 0.18);
  box-shadow: inset 4px 0 0 rgba(25, 135, 84, 0.90);
}

tr.row-status-active td {
  color: #0f5132;
  font-weight: 600;
}
tr.row-status-pending {
  background: rgba(13, 110, 253, 0.10);
}
tr.row-status-expired {
  background: rgba(108, 117, 125, 0.12);
}
tr.row-status-error {
  background: rgba(220, 53, 69, 0.10);
}

/* keep hover readable (slightly stronger tint) */
tr.row-status-active:hover {
  background: rgba(25, 135, 84, 0.24);
}
tr.row-status-pending:hover {
  background: rgba(13, 110, 253, 0.14);
}
tr.row-status-expired:hover {
  background: rgba(108, 117, 125, 0.16);
}
tr.row-status-error:hover {
  background: rgba(220, 53, 69, 0.14);
}

/* smooth visual */
tr.row-status-active,
tr.row-status-pending,
tr.row-status-expired,
tr.row-status-error {
  transition: background-color 180ms ease;
}

/* Mobile */
@media (max-width: 600px) {
  .card {
    padding: 16px;
    border-radius: 16px;
  }

  .topbar .title h1 {
    font-size: 22px;
  }

  .nav {
    width: 100%;
    justify-content: flex-start;
  }

  .nav button {
    padding: 10px 12px;
  }

  input, select {
    font-size: 16px; /* avoid iOS zoom */
  }
}

/* Plans: deleted badge + danger button */
.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;line-height:18px;vertical-align:middle;}
.badge-deleted{background:rgba(220,53,69,.18);border:1px solid rgba(220,53,69,.35);color:#ffd1d6;}
button.danger{background:#dc3545;border-color:#dc3545;}
button.danger:hover{filter:brightness(0.95);}

/* Plans: sticky filter bar under the header */
.sticky-bar{
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  padding: 10px;
  margin-top: 10px;
}

.filters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.filter-search{
  flex: 1 1 260px;
  min-width: 220px;
}

.filter-select{
  width:auto;
}

.filter-btn{
  width:auto;
}

.filter-btn.primary{
  font-weight: 700;
}

@media (max-width: 520px){
  .sticky-bar{
    top: 0;
  }
  .filter-btn.primary{
    width: 100%;
  }
}

/* Modal improvements (mobile-friendly) */
.modal{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 14px;
  overflow: auto;
  z-index: 1000;
}

/* Default modal card */
.modal-card{
  width: 100%;
  max-width: 520px;
  margin: 6vh auto;
  max-height: 88vh;
  overflow: auto;
  padding: 16px;
}

/* Form layout helpers */
.form-row{
  display:flex;
  gap:10px;
  align-items:center;
}
.check-row{
  display:flex;
  gap:10px;
  align-items:center;
  margin: 10px 0;
}

/* Sticky action bar inside modal */
.modal-actions{
  position: sticky;
  bottom: 0;
  display:flex;
  gap:10px;
  justify-content:flex-end;
  padding-top: 12px;
  background: rgba(255,255,255,0.96);
  border-top: 1px solid rgba(0,0,0,.06);
  margin-top: 12px;
}

/* On small screens, modal becomes near full-screen */
@media (max-width: 520px){
  .modal{
    padding: 10px;
    align-items: stretch;
  }
  .modal-card{
    margin: 0;
    max-height: 94vh;
    border-radius: 18px;
  }
  .modal-actions{
    justify-content: space-between;
  }
  .modal-actions button{
    width: 48%;
  }
  /* Ensure form inputs are readable (avoid iOS zoom) */
  .modal-card input, .modal-card select, .modal-card button{
    font-size: 16px;
  }
}

/* ------------------------------------------------------------------ */
/* RAZAFI Admin - Starlink-style drawer + 2-bar hamburger -> back arrow */
/* (Inserted at end: minimal risk to existing styles)                   */
/* ------------------------------------------------------------------ */

.rz-topbar-has-drawer {
  display: flex;
  align-items: center;
  gap: 10px;
}

.rz-nav-mount {
  display: flex;
  align-items: center;
}

/* Button */
.rz-nav-btn {
  appearance: none;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 8px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.rz-nav-btn:active { transform: translateY(1px); }

/* Closed: 2 bars */
.rz-icon-bars {
  display: inline-flex;
  flex-direction: column;
  gap: 6px;
}

.rz-bar {
  width: 22px;
  height: 2.5px;
  border-radius: 999px;
  background: currentColor;
  display: block;
}

/* Open: show arrow instead of bars */
.rz-icon-arrow {
  display: none;
  align-items: center;
  justify-content: center;
}

body.rz-drawer-open .rz-icon-bars { display: none; }
body.rz-drawer-open .rz-icon-arrow { display: inline-flex; }

/* Overlay */
.rz-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
  z-index: 9998;
}

body.rz-drawer-open .rz-drawer-overlay {
  opacity: 1;
  pointer-events: auto;
}

/* Drawer */
.rz-drawer {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: min(320px, 86vw);
  background: #ffffff;
  color: #111;
  transform: translateX(-110%);
  transition: transform .22s ease;
  z-index: 9999;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  display: flex;
  flex-direction: column;
}

body.rz-drawer-open .rz-drawer {
  transform: translateX(0);
}

.rz-drawer-head {
  padding: 16px 16px 12px 16px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.rz-drawer-title {
  font-weight: 900;
  font-size: 16px;
}

.rz-drawer-sub {
  margin-top: 8px;
  opacity: .75;
  font-size: 13px;
}

.rz-drawer-nav {
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rz-item {
  text-decoration: none;
  color: inherit;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 12px;
  border-radius: 12px;
}

.rz-item:hover { background: rgba(0,0,0,.05); }

.rz-item.active {
  background: rgba(13,110,253,.10);
  outline: 1px solid rgba(13,110,253,.20);
}

.rz-item-label {
  font-weight: 800;
  font-size: 14px;
}

.rz-drawer-foot {
  margin-top: auto;
  padding: 12px 16px 16px 16px;
  border-top: 1px solid rgba(0,0,0,.08);
}

.rz-logout {
  width: 100%;
  border: 0;
  border-radius: 12px;
  padding: 12px;
  font-weight: 900;
  cursor: pointer;
}
/* Ensure hamburger/back arrow is visible on white cards */
.rz-nav-btn {
  color: #0d6efd; /* same blue as your titles */
}
/* ------------------------------------------------------------------ */
/* Admin Index - Advanced tools tiles (Audit only visible on index)    */
/* ------------------------------------------------------------------ */

.rz-advanced-card {
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 10px 22px rgba(0,0,0,0.08);
}

.rz-tool-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 12px;
}

@media (max-width: 700px){
  .rz-tool-grid{
    grid-template-columns: 1fr;
  }
}

.rz-tool-card{
  display: flex;
  gap: 12px;
  align-items: center;
  text-decoration: none;
  color: inherit;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.06);
  background: rgba(13,110,253,0.04);
  transition: transform 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.rz-tool-card:hover{
  background: rgba(13,110,253,0.07);
  box-shadow: 0 10px 18px rgba(0,0,0,0.08);
  transform: translateY(-1px);
}

.rz-tool-icon{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(13,110,253,0.12);
  font-size: 20px;
}

.rz-tool-title{
  font-weight: 900;
  font-size: 15px;
}

.rz-tool-sub{
  opacity: .75;
  font-size: 13px;
  margin-top: 4px;
}



/* ===== Audit page improvements ===== */
tr.audit-row { cursor: pointer; }
tr.audit-row:hover { filter: brightness(0.985); }

tr.audit-row.status-failed,
tr.audit-row.status-error {
  background: rgba(220, 53, 69, 0.10);
}
tr.audit-row.status-blocked {
  background: rgba(255, 159, 67, 0.14);
}
tr.audit-row.status-warning,
tr.audit-row.status-pending {
  background: rgba(255, 193, 7, 0.12);
}
tr.audit-row.status-success,
tr.audit-row.status-ok {
  background: rgba(40, 167, 69, 0.10);
}
tr.audit-row.status-info {
  background: rgba(13, 110, 253, 0.06);
}

.badge.audit-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(0,0,0,.04);
}

.badge.audit-badge.status-failed,
.badge.audit-badge.status-error {
  background: rgba(220, 53, 69, 0.12);
  border-color: rgba(220, 53, 69, 0.28);
}

.badge.audit-badge.status-blocked {
  background: rgba(255, 159, 67, 0.16);
  border-color: rgba(255, 159, 67, 0.30);
}

.badge.audit-badge.status-warning,
.badge.audit-badge.status-pending {
  background: rgba(255, 193, 7, 0.16);
  border-color: rgba(255, 193, 7, 0.30);
}

.badge.audit-badge.status-success,
.badge.audit-badge.status-ok {
  background: rgba(40, 167, 69, 0.14);
  border-color: rgba(40, 167, 69, 0.28);
}

.badge.audit-badge.status-info {
  background: rgba(13, 110, 253, 0.10);
  border-color: rgba(13, 110, 253, 0.22);
}

/* Audit modal layout */
.audit-modal-card {
  max-width: 900px;
  width: min(900px, 92vw);
  max-height: 86vh;
  overflow: auto;
}

.audit-modal-summary {
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
}

.audit-kv {
  background: rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 14px;
  padding: 10px 12px;
}

.audit-kv .k {
  font-size: 12px;
  opacity: .75;
  font-weight: 700;
  margin-bottom: 4px;
}

.audit-kv .v {
  font-weight: 900;
  word-break: break-word;
}

.audit-kv-wide {
  grid-column: 1 / -1;
}

.audit-meta-pre {
  margin-top: 10px;
  background: #0b1220;
  color: #dbe7ff;
  border-radius: 14px;
  padding: 12px;
  overflow: auto;
  max-height: 42vh;
  font-size: 12px;
  line-height: 1.35;
}

.audit-copy-btn {
  padding: 8px 10px;
}

/* Responsive */
@media (max-width: 900px) {
  .audit-modal-summary { grid-template-columns: 1fr; }
}


/* ------------------------------------------------------------------ */
/* Dashboard / Pools - AP status dot (Tanaza truth)                    */
/* ------------------------------------------------------------------ */
.ap-dot{
  display:inline-block;
  width:14px;
  height:14px;
  border-radius:999px;
  vertical-align:middle;
  /* make it look sharp like APs page dot */
  box-shadow: 0 0 0 2px rgba(255,255,255,0.9) inset, 0 1px 2px rgba(0,0,0,0.18);
}
.ap-dot.online{
  background:#28a745;
  border:1px solid rgba(25,135,84,0.65);
}
.ap-dot.offline{
  background:#dc3545;
  border:1px solid rgba(220,53,69,0.65);
}
.ap-dot.unknown{
  background:#adb5bd;
  border:1px solid rgba(108,117,125,0.55);
}

/* ================================================================== */
/* USERS PAGE MODAL FIXES (minimal & safe)                             */
/* ================================================================== */

/* Solid white modal card (fix "transparent" look) */
.modal-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 18px;
  box-shadow: 0 20px 45px rgba(0,0,0,0.22);
}

/* Users modal action layout */
.users-modal-actions{
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

/* Right actions group (Save + Close) */
.users-modal-right-actions{
  display: flex;
  gap: 10px;
  align-items: center;
}

/* Mobile: stack Delete, then row Save/Close */
@media (max-width: 520px){
  .users-modal-actions{
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .users-modal-actions > button{
    width: 100%;
  }
  .users-modal-right-actions{
    width: 100%;
  }
  .users-modal-right-actions button{
    width: 50%;
  }
}

/* Pools admin — portal announcement editor */
.pool-announcement-box {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(13, 110, 253, 0.14);
  border-radius: 12px;
  background: rgba(13, 110, 253, 0.045);
}
.pool-announcement-box textarea {
  width: 100%;
  min-height: 74px;
  resize: vertical;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid #ddd;
  font-size: 14px;
  margin-top: 8px;
  margin-bottom: 0;
}
.pool-announcement-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.pool-announcement-row select {
  padding: 10px;
  border-radius: 10px;
  border: 1px solid #ddd;
  font-size: 14px;
  background: #fff;
}
.pool-announcement-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
}
.pool-announcement-check input {
  width: auto;
  margin: 0;
}


/* ================================================================== */
/* RAZAFI UX V1 - Owner-friendly premium appearance upgrade            */
/* Scope: visual only. No permission/API/business-logic changes.       */
/* ================================================================== */
:root{
  --rz-bg: #f5f7fb;
  --rz-surface: rgba(255,255,255,.92);
  --rz-surface-strong: #ffffff;
  --rz-text: #111827;
  --rz-muted: #6b7280;
  --rz-line: rgba(17,24,39,.08);
  --rz-blue: #0d6efd;
  --rz-blue-soft: rgba(13,110,253,.10);
  --rz-green: #16a34a;
  --rz-green-soft: rgba(22,163,74,.12);
  --rz-amber: #f59e0b;
  --rz-red: #ef4444;
  --rz-shadow-soft: 0 18px 45px rgba(15, 23, 42, .10);
  --rz-shadow-card: 0 12px 28px rgba(15, 23, 42, .08);
  --rz-radius-xl: 28px;
  --rz-radius-lg: 22px;
  --rz-radius-md: 16px;
}

body{
  color: var(--rz-text);
  background:
    radial-gradient(circle at top left, rgba(13,110,253,.16), transparent 28%),
    radial-gradient(circle at bottom right, rgba(22,163,74,.10), transparent 25%),
    var(--rz-bg);
}

body.rz-admin-shell{
  padding-bottom: 140px;
}

body.rz-admin-shell .login-container{
  align-items: flex-start;
  padding: 16px 14px 110px;
}

body.rz-admin-shell > .login-container > .card{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(255,255,255,.80);
  border-radius: 30px;
  box-shadow: var(--rz-shadow-soft);
  backdrop-filter: blur(18px);
  color: var(--rz-text);
}

body.rz-admin-shell .topbar{
  align-items: center;
  margin-bottom: 16px;
}

body.rz-admin-shell .topbar .title h1,
body.rz-admin-shell .topbar h1{
  color: var(--rz-text);
  letter-spacing: -0.04em;
  font-weight: 950;
}

body.rz-admin-shell .subtitle{
  color: var(--rz-muted);
  opacity: 1 !important;
}

.rz-hero-title{
  margin: 0;
  font-size: clamp(26px, 4.5vw, 38px);
  line-height: 1.02;
  letter-spacing: -0.055em;
  color: var(--rz-text);
}

.rz-hero-subtitle{
  margin-top: 8px;
  color: var(--rz-muted);
  font-size: 14px;
  line-height: 1.35;
}

.rz-owner-chip{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.70);
  border: 1px solid var(--rz-line);
  color: var(--rz-muted);
  font-size: 12px;
  font-weight: 800;
  max-width: 100%;
}

.rz-owner-chip::before{
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--rz-green);
  box-shadow: 0 0 0 4px rgba(22,163,74,.12);
  flex: 0 0 auto;
}

body.rz-admin-shell .sticky-bar{
  position: sticky;
  top: 10px;
  z-index: 25;
  margin-top: 14px;
  padding: 12px;
  border-radius: 24px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(255,255,255,.85);
  box-shadow: 0 10px 26px rgba(15,23,42,.07);
  backdrop-filter: blur(18px);
}

body.rz-admin-shell .filters{
  gap: 10px;
}

body.rz-admin-shell input,
body.rz-admin-shell select{
  border-radius: 16px;
  border: 1px solid var(--rz-line);
  background: rgba(255,255,255,.86);
  color: var(--rz-text);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}

body.rz-admin-shell input:focus,
body.rz-admin-shell select:focus{
  outline: none;
  border-color: rgba(13,110,253,.45);
  box-shadow: 0 0 0 4px rgba(13,110,253,.10);
}

body.rz-admin-shell button,
body.rz-admin-shell .filter-btn{
  border-radius: 16px;
  font-weight: 850;
  box-shadow: 0 8px 18px rgba(13,110,253,.10);
}

body.rz-admin-shell .filter-btn{
  background: rgba(255,255,255,.88);
  color: var(--rz-text);
  border: 1px solid var(--rz-line);
}

body.rz-admin-shell .filter-btn.primary,
body.rz-admin-shell button.primary{
  background: linear-gradient(135deg, #0d6efd, #2563eb);
  color: #fff;
  border-color: transparent;
}

.rz-dashboard-shell{
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.rz-dashboard-tools{
  margin-top: 10px;
}

.rz-dashboard-status{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  color: var(--rz-muted);
  font-size: 13px;
  font-weight: 750;
}

.rz-dashboard-status::before{
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--rz-blue);
  box-shadow: 0 0 0 4px rgba(13,110,253,.10);
}

.rz-pools-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.rz-pool-card{
  position: relative;
  overflow: hidden;
  padding: 18px;
  border-radius: var(--rz-radius-xl);
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.82));
  border: 1px solid rgba(255,255,255,.92);
  box-shadow: var(--rz-shadow-card);
}

.rz-pool-card::before{
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, #0d6efd, #60a5fa, #22c55e);
}

.rz-pool-card.rz-saturated::before{
  background: linear-gradient(90deg, #ef4444, #f97316);
}

.rz-pool-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.rz-pool-name{
  font-size: 19px;
  line-height: 1.05;
  font-weight: 950;
  letter-spacing: -0.035em;
}

.rz-pool-id{
  margin-top: 6px;
  color: var(--rz-muted);
  font-size: 11px;
  max-width: 230px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rz-pool-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 12px;
  border-radius: 16px;
  background: var(--rz-blue-soft);
  color: var(--rz-blue);
  font-weight: 950;
  font-size: 17px;
}

.rz-pool-metrics{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 16px;
}

.rz-metric{
  padding: 12px;
  border-radius: 20px;
  background: rgba(248,250,252,.92);
  border: 1px solid var(--rz-line);
}

.rz-metric-label{
  color: var(--rz-muted);
  font-size: 12px;
  font-weight: 800;
}

.rz-metric-value{
  margin-top: 4px;
  font-size: 26px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: -0.04em;
}

.rz-progress-block{
  margin-top: 15px;
}

.rz-progress-top{
  display:flex;
  justify-content:space-between;
  gap:10px;
  color: var(--rz-muted);
  font-size: 12px;
  font-weight: 850;
  margin-bottom: 8px;
}

.rz-progress-track{
  height: 11px;
  border-radius: 999px;
  background: rgba(15,23,42,.08);
  overflow:hidden;
}

.rz-progress-fill{
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #22c55e, #0d6efd);
  transition: width .22s ease;
}

.rz-progress-fill.warn{ background: linear-gradient(90deg, #f59e0b, #f97316); }
.rz-progress-fill.danger{ background: linear-gradient(90deg, #ef4444, #f97316); }

.rz-ap-section{
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--rz-line);
}

.rz-ap-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom: 10px;
  color: var(--rz-muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.rz-ap-list{
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rz-ap-row{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border-radius: 18px;
  background: rgba(248,250,252,.86);
  border: 1px solid var(--rz-line);
}

.rz-ap-row.is-offline{ opacity: .68; }

.rz-ap-main{
  min-width: 0;
}

.rz-ap-name{
  font-weight: 900;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rz-ap-mac{
  margin-top: 3px;
  color: var(--rz-muted);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rz-ap-side{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight: 950;
}

.rz-empty-card{
  padding: 18px;
  border-radius: var(--rz-radius-lg);
  background: rgba(255,255,255,.82);
  border: 1px solid var(--rz-line);
  color: var(--rz-muted);
  font-weight: 750;
}

/* Telegram-style bottom shortcut navigation */
.rz-bottom-nav{
  position: fixed;
  left: 50%;
  bottom: max(14px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  width: min(460px, calc(100vw - 24px));
  z-index: 9997;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
  padding: 8px;
  border-radius: 28px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(255,255,255,.92);
  box-shadow: 0 18px 50px rgba(15,23,42,.20);
  backdrop-filter: blur(20px);
}

.rz-bottom-item{
  text-decoration: none;
  color: var(--rz-muted);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-height: 56px;
  border-radius: 22px;
  font-size: 11px;
  font-weight: 900;
  transition: transform .14s ease, background-color .14s ease, color .14s ease;
}

.rz-bottom-item:active{ transform: scale(.98); }

.rz-bottom-icon{
  font-size: 20px;
  line-height: 1;
}

.rz-bottom-item.active{
  background: linear-gradient(180deg, rgba(13,110,253,.14), rgba(13,110,253,.08));
  color: var(--rz-blue);
  box-shadow: inset 0 0 0 1px rgba(13,110,253,.12);
}

.rz-drawer{
  border-top-right-radius: 26px;
  border-bottom-right-radius: 26px;
}

.rz-item{
  font-weight: 800;
}

.rz-item.active{
  color: var(--rz-blue);
}

.rz-loading-card{
  padding:18px;
  border-radius:24px;
  background:rgba(255,255,255,.78);
  border:1px solid var(--rz-line);
  color:var(--rz-muted);
  font-weight:800;
}

@media (max-width: 700px){
  body.rz-admin-shell .login-container{
    padding-left: 10px;
    padding-right: 10px;
  }
  body.rz-admin-shell > .login-container > .card{
    width: 100% !important;
    border-radius: 26px;
    padding: 16px;
  }
  .rz-pools-grid{
    grid-template-columns: 1fr;
  }
  .rz-pool-card{
    padding: 16px;
  }
  .rz-pool-id{
    max-width: 190px;
  }
  .rz-bottom-nav{
    width: calc(100vw - 18px);
    border-radius: 26px;
  }
  .rz-bottom-item{
    min-height: 54px;
    font-size: 10.5px;
  }
}


/* ================================================================== */
/* RAZAFI UX V2 - Premium polish only                                  */
/* Scope: appearance/navigation only. No backend/API/permission logic.  */
/* ================================================================== */

:root{
  --rz-blue-2:#1473ff;
  --rz-card-shadow: 0 18px 42px rgba(15,23,42,.10);
  --rz-card-shadow-soft: 0 10px 28px rgba(15,23,42,.08);
}

body.rz-admin-shell{
  background:
    radial-gradient(circle at 20% -10%, rgba(13,110,253,.16), transparent 38%),
    radial-gradient(circle at 90% 5%, rgba(34,197,94,.10), transparent 28%),
    linear-gradient(180deg, #f8fbff 0%, #eef5ff 48%, #f8fafc 100%);
}

body.rz-admin-shell > .login-container > .card{
  box-shadow: none;
  border: 0;
  background: rgba(255,255,255,.66);
}

.rz-dashboard-shell{
  background: transparent !important;
}

.rz-hero-title{
  letter-spacing: -.04em;
  color:#0f172a !important;
}

.rz-hero-subtitle{
  max-width: 420px;
}

.rz-owner-chip{
  display:inline-flex;
  max-width:100%;
  align-items:center;
  gap:7px;
  margin-top:10px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(13,110,253,.08);
  color:#1d4ed8;
  font-weight:850;
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rz-owner-chip::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:999px;
  background:#22c55e;
  box-shadow:0 0 0 4px rgba(34,197,94,.14);
  flex:0 0 auto;
}

/* Premium search/filter card */
.rz-dashboard-tools{
  border:0 !important;
  box-shadow: var(--rz-card-shadow-soft) !important;
  background: rgba(255,255,255,.86) !important;
  border-radius: 30px !important;
  padding: 16px !important;
  margin-bottom: 10px;
}
.rz-dashboard-tools .filters{
  align-items: stretch;
}
.rz-dashboard-tools input,
.rz-dashboard-tools select,
.sticky-bar input,
.sticky-bar select{
  height:52px;
  border-radius:18px !important;
  border:1px solid rgba(15,23,42,.08) !important;
  background:rgba(248,250,252,.92) !important;
  color:#0f172a;
  box-shadow: inset 0 1px 2px rgba(15,23,42,.03);
}
.rz-dashboard-tools input:focus,
.rz-dashboard-tools select:focus,
.sticky-bar input:focus,
.sticky-bar select:focus{
  outline:none;
  border-color:rgba(13,110,253,.35) !important;
  box-shadow:0 0 0 4px rgba(13,110,253,.10), inset 0 1px 2px rgba(15,23,42,.03);
}

/* New clean buttons - override older browser-like border */
.filter-btn,
.rz-dashboard-tools button,
button.filter-btn.primary{
  border:0 !important;
  outline:0 !important;
  border-radius:18px !important;
  box-shadow:0 10px 22px rgba(13,110,253,.18) !important;
  font-weight:950 !important;
  letter-spacing:-.02em;
}
.rz-dashboard-tools #refresh,
button.filter-btn.primary{
  min-height:52px;
  padding:0 20px !important;
  background:linear-gradient(180deg, #2382ff 0%, #0d6efd 100%) !important;
}
.rz-dashboard-tools #refresh::before{
  content:"↻";
  display:inline-block;
  margin-right:8px;
  font-size:18px;
  transform: translateY(1px);
}
.rz-dashboard-tools #refresh:hover,
button.filter-btn.primary:hover{
  filter:none !important;
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(13,110,253,.24) !important;
}

/* Pool cards: softer Apple-like cards */
.rz-pools-grid{
  gap:18px;
}
.rz-pool-card{
  border:1px solid rgba(15,23,42,.06) !important;
  border-radius:34px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,255,255,.89)) !important;
  box-shadow: var(--rz-card-shadow) !important;
  overflow:hidden;
}
.rz-pool-card::before{
  height:5px;
  background:linear-gradient(90deg, #0d6efd 0%, #16a34a 100%);
}
.rz-pool-card:hover{
  transform:translateY(-1px);
  box-shadow:0 22px 48px rgba(15,23,42,.13) !important;
}
.rz-pool-head{
  align-items:flex-start;
}
.rz-pool-name{
  font-size:24px;
  letter-spacing:-.055em;
  color:#0b1220;
}
.rz-pool-id{
  display:none !important;
}
.rz-pool-badge{
  width:58px;
  height:58px;
  background:linear-gradient(180deg, rgba(13,110,253,.12), rgba(13,110,253,.07));
  color:var(--rz-blue);
  border:1px solid rgba(13,110,253,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}
.rz-pool-badge::after{
  content:"clients";
  display:block;
  font-size:9px;
  font-weight:900;
  color:rgba(13,110,253,.72);
  margin-top:1px;
  letter-spacing:-.02em;
}
.rz-pool-metrics{
  gap:12px;
  margin-top:18px;
}
.rz-metric{
  border:1px solid rgba(15,23,42,.07);
  background:rgba(248,250,252,.82);
  border-radius:22px;
  padding:16px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82);
}
.rz-metric-label{
  font-size:13px;
  letter-spacing:-.02em;
}
.rz-metric-value{
  font-size:32px;
  color:#0f172a;
}
.rz-progress-block{
  margin-top:20px;
}
.rz-progress-top{
  font-size:13px;
  color:#64748b;
}
.rz-progress-track{
  height:12px;
  background:rgba(15,23,42,.06);
  box-shadow: inset 0 1px 2px rgba(15,23,42,.05);
}
.rz-progress-fill{
  min-width:0;
  background:linear-gradient(90deg, #22c55e 0%, #86efac 52%, #0d6efd 100%);
  box-shadow:0 0 14px rgba(34,197,94,.25);
}
.rz-progress-fill.warn{
  background:linear-gradient(90deg, #f59e0b, #fbbf24);
  box-shadow:0 0 14px rgba(245,158,11,.22);
}
.rz-progress-fill.danger{
  background:linear-gradient(90deg, #ef4444, #fb7185);
  box-shadow:0 0 14px rgba(239,68,68,.22);
}
.rz-ap-section{
  margin-top:20px;
  padding-top:18px;
}
.rz-empty-card{
  border-radius:24px;
  background:rgba(248,250,252,.72);
  border:1px dashed rgba(100,116,139,.20);
  color:#64748b;
  text-align:center;
  padding:20px;
}

/* Bottom navigation V2: stable Telegram/iOS mobile behavior */
.rz-bottom-nav{
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 12px;

  width:min(430px, calc(100vw - 26px));
  z-index: 99999;

  padding:9px;
  gap:5px;

  border-radius:32px;

  background:rgba(255,255,255,.86);
  border:1px solid rgba(226,232,240,.72);

  box-shadow:
    0 20px 55px rgba(15,23,42,.18),
    0 6px 18px rgba(15,23,42,.08);

  -webkit-backdrop-filter: blur(22px) saturate(1.25);
  backdrop-filter: blur(22px) saturate(1.25);
}
.rz-bottom-item{
  min-height:58px;
  border-radius:24px;
  color:#64748b;
  font-size:10.5px;
  letter-spacing:-.02em;
}
.rz-bottom-icon{
  width:23px;
  height:23px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.rz-bottom-icon svg{
  width:22px;
  height:22px;
  display:block;
}
.rz-bottom-item.active{
  background:linear-gradient(180deg, rgba(13,110,253,.15), rgba(13,110,253,.08));
  color:#0d6efd;
  box-shadow:inset 0 0 0 1px rgba(13,110,253,.12), 0 8px 18px rgba(13,110,253,.09);
}
.rz-bottom-item.active .rz-bottom-icon{
  filter:drop-shadow(0 4px 7px rgba(13,110,253,.18));
}

/* Reduce content being hidden by the footer */
#status{
  padding-bottom: 92px;
  color:#64748b;
  font-weight:700;
}

@media (max-width: 700px){
  body.rz-admin-shell > .login-container > .card{
    padding-left:14px;
    padding-right:14px;
  }
  .rz-dashboard-tools{
    padding:14px !important;
  }
  .rz-dashboard-tools .filters{
    gap:11px;
  }
  .rz-dashboard-tools #refresh{
    width:100% !important;
  }
  .rz-pool-card{
    padding:18px;
    border-radius:32px !important;
  }
  .rz-pool-name{
    font-size:23px;
  }
  .rz-pool-badge{
    width:54px;
    height:54px;
  }
  .rz-metric-value{
    font-size:30px;
  }
  .rz-bottom-nav{
    width:calc(100vw - 28px);
  }
}

.rz-pool-status{
  margin-top:5px;
  color:#64748b;
  font-size:13px;
  font-weight:800;
}
.rz-pool-status::before{
  content:"";
  display:inline-block;
  width:8px;
  height:8px;
  margin-right:7px;
  border-radius:999px;
  background:#22c55e;
  box-shadow:0 0 0 4px rgba(34,197,94,.13);
  vertical-align:middle;
}

/* ================================================================== */
/* RAZAFI Dashboard compact French owner view                          */
/* Scope: dashboard appearance only. No backend/API/permission changes. */
/* ================================================================== */
.rz-dashboard-tools.rz-dashboard-tools-compact{
  max-width: 760px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 12px !important;
  border-radius: 26px !important;
}

.rz-dashboard-tools-compact .filters{
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  align-items: stretch;
  gap: 10px;
}

.rz-dashboard-tools-compact #poolFilter{
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-bottom: 0;
}

.rz-dashboard-tools-compact #refresh{
  min-width: 150px;
  white-space: nowrap;
}

.rz-pools-grid{
  grid-template-columns: minmax(0, 760px) !important;
  justify-content: center;
  gap: 12px !important;
  margin-top: 12px !important;
}

.rz-pool-card.rz-pool-card-compact{
  padding: 15px 16px 14px !important;
  border-radius: 26px !important;
  min-height: auto;
}

.rz-pool-card-compact::before{
  height: 4px !important;
}

.rz-pool-compact-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.rz-pool-card-compact .rz-pool-name{
  font-size: 21px !important;
  line-height: 1.05;
  letter-spacing: -.045em;
}

.rz-pool-compact-sub{
  margin-top: 6px;
  color: #64748b;
  font-size: 13px;
  font-weight: 850;
}

.rz-pool-usage-pill{
  flex: 0 0 auto;
  min-width: 58px;
  padding: 8px 10px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(13,110,253,.12), rgba(13,110,253,.06));
  color: #0d6efd;
  border: 1px solid rgba(13,110,253,.10);
  text-align: center;
  font-weight: 950;
  font-size: 18px;
  line-height: 1;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}

.rz-pool-usage-pill span{
  display: block;
  margin-top: 4px;
  color: rgba(13,110,253,.72);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: -.01em;
}

.rz-pool-card-compact .rz-progress-block{
  margin-top: 12px !important;
}

.rz-pool-card-compact .rz-progress-top{
  margin-bottom: 7px;
  font-size: 12.5px;
}

.rz-pool-card-compact .rz-progress-track{
  height: 9px !important;
}

.rz-dashboard-status{
  max-width: 760px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 94px !important;
}

@media (min-width: 900px){
  .rz-dashboard-tools-compact #refresh{
    width: auto !important;
  }
}

@media (max-width: 700px){
  .rz-dashboard-tools.rz-dashboard-tools-compact{
    padding: 12px !important;
    margin-bottom: 6px;
    border-radius: 24px !important;
  }

  .rz-dashboard-tools-compact .filters{
    grid-template-columns: 1fr;
    gap: 9px;
  }

  .rz-dashboard-tools-compact #refresh{
    width: 100% !important;
    min-height: 48px;
  }

  .rz-pools-grid{
    gap: 10px !important;
    margin-top: 10px !important;
  }

  .rz-pool-card.rz-pool-card-compact{
    padding: 14px 15px 13px !important;
    border-radius: 24px !important;
  }

  .rz-pool-card-compact .rz-pool-name{
    font-size: 20px !important;
  }

  .rz-pool-compact-sub{
    font-size: 12.5px;
  }

  .rz-pool-usage-pill{
    min-width: 54px;
    padding: 7px 9px;
    border-radius: 16px;
    font-size: 17px;
  }

  .rz-pool-card-compact .rz-progress-block{
    margin-top: 10px !important;
  }
}


/* ================================================================== */
/* RAZAFI compact admin identity (shared header polish)                */
/* Scope: visual only. Keeps auth/session logic unchanged.             */
/* ================================================================== */
.rz-hero-subtitle{
  display: none !important;
}

.rz-owner-chip{
  display: inline-flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.18 !important;
}

.rz-owner-chip::before{
  margin-top: 4px;
}

.rz-owner-label,
.rz-owner-name{
  display: block;
}

.rz-owner-label{
  color: #64748b;
  font-size: 11px;
  font-weight: 850;
}

.rz-owner-name{
  margin-top: 2px;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 950;
  word-break: break-word;
}

@media (max-width: 700px){
  .rz-owner-chip{
    max-width: 100%;
    padding: 7px 10px !important;
  }
}


/* ================================================================== */
/* RAZAFI Dashboard mobile space-saving polish                         */
/* Scope: visual only. Bottom nav/filter/header compactness.           */
/* ================================================================== */

/* Identity chip: icon + clean two-line text */
.rz-owner-chip{
  align-items: center !important;
  gap: 8px !important;
  max-width: min(520px, 100%) !important;
}

.rz-owner-chip::before{
  margin-top: 0 !important;
  flex: 0 0 auto;
}

.rz-owner-text{
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.12;
}

.rz-owner-label,
.rz-owner-name{
  display: block;
}

.rz-owner-label{
  font-size: 11px;
  font-weight: 850;
  color: #64748b;
}

.rz-owner-name{
  margin-top: 2px;
  font-size: 12px;
  font-weight: 950;
  color: #1d4ed8;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Bottom nav: closer to Telegram height while staying fixed */
.rz-bottom-nav{
  bottom: 10px !important;
  width: min(420px, calc(100vw - 30px)) !important;
  padding: 6px !important;
  gap: 4px !important;
  border-radius: 26px !important;
  z-index: 99999 !important;
}

.rz-bottom-item{
  min-height: 46px !important;
  border-radius: 20px !important;
  gap: 2px !important;
  font-size: 10px !important;
  line-height: 1.05 !important;
}

.rz-bottom-icon{
  width: 20px !important;
  height: 20px !important;
}

.rz-bottom-icon svg{
  width: 20px !important;
  height: 20px !important;
}

/* Leave enough room, but less than before */
body.rz-admin-shell{
  padding-bottom: 118px !important;
}

#status,
.rz-dashboard-status{
  padding-bottom: 76px !important;
}

@media (max-width: 700px){
  body.rz-admin-shell .login-container{
    padding-top: 10px !important;
    padding-bottom: 96px !important;
  }

  body.rz-admin-shell > .login-container > .card{
    padding-top: 13px !important;
  }

  body.rz-admin-shell .topbar{
    margin-bottom: 8px !important;
  }

  .rz-hero-title{
    font-size: 24px !important;
    line-height: 1.02 !important;
  }

  .rz-owner-chip{
    margin-top: 8px !important;
    padding: 6px 9px !important;
    border-radius: 18px !important;
  }

  .rz-owner-name{
    max-width: 260px;
  }

  /* Compact filter/action block on mobile: same line */
  .rz-dashboard-tools.rz-dashboard-tools-compact{
    padding: 8px !important;
    border-radius: 22px !important;
    margin-top: 6px !important;
    margin-bottom: 4px !important;
  }

  .rz-dashboard-tools-compact .filters{
    grid-template-columns: minmax(0, 1fr) 116px !important;
    gap: 8px !important;
    align-items: center !important;
  }

  .rz-dashboard-tools-compact #poolFilter,
  .rz-dashboard-tools select,
  .sticky-bar select{
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 16px !important;
    font-size: 15px !important;
    padding: 0 12px !important;
  }

  .rz-dashboard-tools-compact #refresh{
    width: auto !important;
    min-width: 0 !important;
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 16px !important;
    padding: 0 10px !important;
    font-size: 14px !important;
  }

  .rz-dashboard-tools #refresh::before{
    margin-right: 5px !important;
    font-size: 15px !important;
  }

  .rz-pools-grid{
    margin-top: 8px !important;
  }

  /* On very narrow phones, keep readability by stacking only if necessary */
  @media (max-width: 340px){
    .rz-dashboard-tools-compact .filters{
      grid-template-columns: 1fr !important;
    }

    .rz-dashboard-tools-compact #refresh{
      width: 100% !important;
    }
  }
}

/* ================================================================== */
/* RAZAFI Clients page mobile correction                               */
/* Scope: UX/layout only. Keeps table status colors and logic intact.   */
/* ================================================================== */
html,
body.rz-admin-shell{
  max-width: 100%;
  overflow-x: hidden;
}

.rz-clients-shell{
  background: transparent !important;
}

.rz-clients-shell,
.rz-clients-shell *{
  min-width: 0;
}

.rz-clients-topbar{
  position: relative;
  justify-content: center !important;
  text-align: center;
  margin-bottom: 12px !important;
}

.rz-clients-topbar .rz-nav-mount,
.rz-clients-shell .rz-nav-mount{
  position: absolute;
  left: 0;
  top: 4px;
  z-index: 5;
}

.rz-clients-topbar .title{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.rz-clients-shell .rz-owner-chip{
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  max-width: min(300px, calc(100vw - 110px)) !important;
  padding: 6px 10px !important;
  border-radius: 18px !important;
  text-align: left;
}

.rz-clients-shell .rz-owner-text{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  min-width: 0;
  line-height: 1.12;
}

.rz-clients-shell .rz-owner-name{
  max-width: 230px;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.rz-clients-tools{
  width: min(100%, 960px);
  margin-left: auto;
  margin-right: auto;
  padding: 12px !important;
  border-radius: 28px !important;
}

.rz-clients-tools .filters{
  display: grid !important;
  grid-template-columns: minmax(220px, 1.6fr) minmax(120px, .75fr) minmax(140px, .9fr) minmax(140px, .9fr) auto auto;
  gap: 10px !important;
  align-items: center !important;
}

.rz-clients-tools input,
.rz-clients-tools select,
.rz-clients-tools button{
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 12px !important;
  border-radius: 18px !important;
  font-size: 14px !important;
  line-height: 1.1 !important;
}

.rz-clients-tools select{
  color: #0f172a !important;
  appearance: auto !important;
  -webkit-appearance: menulist !important;
}

.rz-clients-tools button{
  white-space: nowrap;
  font-weight: 950 !important;
}

.rz-clients-summary{
  width: min(100%, 960px);
  margin: 12px auto 0;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px !important;
}

.rz-client-summary-card{
  padding: 11px 13px;
  border-radius: 20px;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(226,232,240,.82);
  box-shadow: 0 10px 24px rgba(15,23,42,.07);
}

.rz-client-summary-label{
  color: #64748b;
  font-size: 12px;
  font-weight: 900;
}

.rz-client-summary-value{
  margin-top: 2px;
  color: #0d6efd;
  font-size: 26px;
  font-weight: 950;
  line-height: 1;
}

.rz-clients-shell .table-wrap{
  width: min(100%, 1080px);
  max-width: 100%;
  margin: 14px auto 0;
  overflow-x: auto;
  overflow-y: visible;
  border-radius: 22px;
  -webkit-overflow-scrolling: touch;
  background: rgba(255,255,255,.54);
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
}

.rz-clients-shell table{
  width: 100%;
  min-width: 980px;
  background: rgba(255,255,255,.82);
}

.rz-clients-shell thead th{
  background: rgba(255,255,255,.88);
  color: #334155;
  font-size: 12px;
  font-weight: 950;
  white-space: nowrap;
}

.rz-clients-shell tbody td{
  font-size: 13px;
  vertical-align: middle;
}

/* Keep bottom nav inside viewport even when table scrolls horizontally */
.rz-bottom-nav{
  max-width: calc(100vw - 30px) !important;
  left: 50vw !important;
  right: auto !important;
}

/* Modal polish for Clients: buttons stay above bottom nav */
.rz-clients-shell + .modal,
#modal.modal{
  z-index: 100000;
}

#modal .modal-card{
  max-width: min(900px, calc(100vw - 24px));
  width: min(900px, calc(100vw - 24px));
  max-height: calc(100dvh - 34px);
  margin: 14px auto;
  padding: 16px 16px 128px !important;
  border-radius: 24px;
}

#modal .modal-actions{
  position: sticky;
  bottom: 70px;
  z-index: 4;
  padding: 10px 0 0;
  margin-top: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.78), #fff 35%);
}

#modal .modal-actions button{
  min-height: 44px;
  border-radius: 16px;
}

.rz-client-detail-grid{
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.rz-detail-card{
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  padding:11px 12px;
  background: rgba(248,250,252,.76);
}

.rz-detail-label{
  font-size: 11px;
  color: #64748b;
  font-weight: 850;
}

.rz-detail-value{
  margin-top: 4px;
  font-size: 14px;
  font-weight: 850;
  color: #0f172a;
  word-break: break-word;
}

@media (max-width: 700px){
  .rz-clients-topbar{
    padding-top: 34px;
  }

  .rz-clients-topbar .rz-nav-mount,
  .rz-clients-shell .rz-nav-mount{
    left: 0;
    top: 0;
  }

  .rz-clients-shell .rz-hero-title{
    font-size: 26px !important;
  }

  .rz-clients-shell .rz-owner-chip{
    max-width: min(300px, calc(100vw - 74px)) !important;
  }

  .rz-clients-tools{
    width: 100%;
    padding: 10px !important;
    border-radius: 24px !important;
    margin-top: 8px !important;
  }

  .rz-clients-tools .filters{
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  .rz-clients-tools #search{
    grid-column: 1 / -1;
  }

  .rz-clients-tools input,
  .rz-clients-tools select,
  .rz-clients-tools button{
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 17px !important;
    font-size: 14px !important;
  }

  .rz-clients-summary{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
    margin-top: 10px;
  }

  .rz-client-summary-card{
    padding: 10px 12px;
    border-radius: 18px;
  }

  .rz-client-summary-value{
    font-size: 24px;
  }

  .rz-clients-shell .table-wrap{
    width: 100%;
    border-radius: 18px;
    margin-top: 12px;
  }

  .rz-clients-shell table{
    min-width: 920px !important;
  }

  #modal .modal-card{
    width: calc(100vw - 18px);
    max-width: calc(100vw - 18px);
    margin: 9px auto;
    max-height: calc(100dvh - 18px);
    padding: 14px 14px 126px !important;
    border-radius: 22px;
  }

  .rz-client-detail-grid{
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  #modal .modal-actions{
    bottom: 68px;
  }
}


/* ================================================================== */
/* RAZAFI Clients targeted fixes                                       */
/* Scope: CSS-only UX fixes. No API/business logic changes.            */
/* Fixes: status select height/label, drawer layering, modal actions.  */
/* ================================================================== */

/* 1) The Clients status <select> uses id="status".
   Older dashboard CSS also targets #status for a text status line,
   which made the select too tall and hid the selected label.
   This override keeps the select compact and readable. */
.rz-clients-tools select#status,
.rz-clients-tools #status.filter-select{
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  padding: 0 12px !important;
  padding-bottom: 0 !important;
  margin: 0 !important;
  line-height: 42px !important;
  display: block !important;
  color: #0f172a !important;
  background: rgba(248,250,252,.92) !important;
  text-align: left !important;
  appearance: auto !important;
  -webkit-appearance: menulist !important;
}

/* 2) Drawer must always be above filters and bottom navigation. */
.rz-drawer-overlay{
  z-index: 2147482000 !important;
}

.rz-drawer{
  z-index: 2147482500 !important;
}

body.rz-drawer-open .rz-clients-tools,
body.rz-drawer-open .sticky-bar,
body.rz-drawer-open .rz-bottom-nav{
  z-index: 1 !important;
}

/* Keep the hamburger/back button clickable and visible, but never above the open drawer. */
.rz-nav-mount,
.rz-nav-btn{
  z-index: 2147482600;
}

/* 3) In the Clients modal, the bottom nav is already hidden behind the modal.
   So action buttons should return to normal modal flow, at the bottom of content. */
#modal .modal-card{
  padding-bottom: 18px !important;
}

#modal .modal-actions{
  position: static !important;
  bottom: auto !important;
  z-index: auto !important;
  padding: 12px 0 0 !important;
  margin-top: 14px !important;
  background: rgba(255,255,255,.96) !important;
  border-top: 1px solid rgba(15,23,42,.08) !important;
  box-shadow: none !important;
}

/* Keep modal buttons clean and full-width on phone, without covering form fields. */
@media (max-width: 700px){
  .rz-clients-tools select#status,
  .rz-clients-tools #status.filter-select{
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    line-height: 42px !important;
    padding: 0 12px !important;
    padding-bottom: 0 !important;
    font-size: 14px !important;
  }

  #modal .modal-card{
    padding-bottom: 16px !important;
  }

  #modal .modal-actions{
    position: static !important;
    display: flex !important;
    gap: 10px !important;
    padding-top: 12px !important;
  }

  #modal .modal-actions button{
    width: 50% !important;
    min-height: 44px !important;
  }
}
/* ================================================================== */
/* RAZAFI Audit page premium redesign                                  */
/* Scope: Audit UX/layout only. No API/business logic changes.         */
/* ================================================================== */
.rz-audit-shell{
  background: transparent !important;
}

.rz-audit-shell,
.rz-audit-shell *{
  min-width: 0;
}

.rz-audit-topbar{
  position: relative;
  justify-content: center !important;
  text-align: center;
  margin-bottom: 12px !important;
}

.rz-audit-topbar .rz-nav-mount,
.rz-audit-shell .rz-nav-mount{
  position: absolute;
  left: 0;
  top: 4px;
  z-index: 5;
}

.rz-audit-topbar .title{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.rz-audit-shell .rz-owner-chip{
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  max-width: min(320px, calc(100vw - 110px)) !important;
  padding: 6px 10px !important;
  border-radius: 18px !important;
  text-align: left;
}

.rz-audit-tools{
  width: min(100%, 1080px);
  margin-left: auto;
  margin-right: auto;
  padding: 12px !important;
  border-radius: 28px !important;
  z-index: 24;
}

.rz-audit-tools .filters{
  display: grid !important;
  grid-template-columns: minmax(220px, 1.3fr) minmax(130px, .75fr) minmax(160px, 1fr) minmax(140px, .85fr) minmax(140px, .85fr) minmax(170px, .95fr) minmax(170px, .95fr) auto auto;
  gap: 10px !important;
  align-items: center !important;
}

.rz-audit-tools input,
.rz-audit-tools select,
.rz-audit-tools button{
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border-radius: 18px !important;
  font-size: 14px !important;
  line-height: 1.1 !important;
}

.rz-audit-tools select,
.rz-audit-tools select#status{
  color: #0f172a !important;
  background: rgba(248,250,252,.92) !important;
  appearance: auto !important;
  -webkit-appearance: menulist !important;
  padding-bottom: 0 !important;
  line-height: 44px !important;
}

.rz-audit-tools button{
  white-space: nowrap;
  font-weight: 950 !important;
}

.rz-audit-status-line{
  width: min(100%, 1080px);
  margin: 12px auto 0;
  color: #64748b;
  font-size: 13px;
  font-weight: 800;
}

.rz-audit-status-line::before{
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-radius: 999px;
  background: #0d6efd;
  box-shadow: 0 0 0 4px rgba(13,110,253,.10);
  vertical-align: middle;
}

.rz-audit-table-wrap{
  width: min(100%, 1080px);
  max-width: 100%;
  margin: 14px auto 0;
  overflow-x: auto;
  overflow-y: visible;
  border-radius: 22px;
  -webkit-overflow-scrolling: touch;
  background: rgba(255,255,255,.54);
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
}

.rz-audit-table{
  min-width: 880px;
  background: rgba(255,255,255,.84);
}

.rz-audit-table thead th{
  background: rgba(255,255,255,.90);
  color: #334155;
  font-size: 12px;
  font-weight: 950;
  white-space: nowrap;
}

.rz-audit-table tbody td{
  font-size: 13px;
  vertical-align: middle;
}

.rz-audit-pager{
  width: min(100%, 1080px);
  margin: 12px auto 0;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.rz-audit-pager button{
  width: auto;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 16px;
  font-weight: 950;
}

.rz-audit-modal-card{
  max-width: min(900px, calc(100vw - 24px)) !important;
  width: min(900px, calc(100vw - 24px)) !important;
  max-height: calc(100dvh - 34px) !important;
  margin: 14px auto !important;
  padding: 16px !important;
  border-radius: 24px !important;
}

.rz-audit-modal-head{
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.rz-audit-modal-title,
.rz-audit-meta-title{
  font-weight: 950;
  color: #0f172a;
}

.rz-audit-modal-head button,
.rz-audit-meta-head button{
  width: auto !important;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 15px;
}

.rz-audit-modal-summary{
  margin-top: 14px !important;
}

.rz-audit-meta-head{
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 12px;
  flex-wrap: wrap;
}

.rz-audit-shell .audit-kv{
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(248,250,252,.78);
  border-radius: 16px;
  padding: 11px 12px;
}

.rz-audit-shell .audit-kv .k{
  color: #64748b;
  opacity: 1;
  font-size: 11px;
  font-weight: 850;
}

.rz-audit-shell .audit-kv .v{
  margin-top: 4px;
  color: #0f172a;
  font-size: 14px;
  font-weight: 850;
}

.rz-audit-shell .audit-meta-pre{
  border-radius: 18px;
  max-height: 44vh;
  border: 1px solid rgba(15,23,42,.10);
}

body.rz-drawer-open .rz-audit-tools,
body.rz-drawer-open .rz-audit-status-line,
body.rz-drawer-open .rz-audit-table-wrap,
body.rz-drawer-open .rz-bottom-nav{
  z-index: 1 !important;
}

@media (max-width: 900px){
  .rz-audit-tools .filters{
    grid-template-columns: 1fr 1fr;
  }

  .rz-audit-tools #q{
    grid-column: 1 / -1;
  }

  .rz-audit-pager button{
    flex: 1 1 0;
  }
}

@media (max-width: 700px){
  .rz-audit-topbar{
    padding-top: 34px;
  }

  .rz-audit-topbar .rz-nav-mount,
  .rz-audit-shell .rz-nav-mount{
    left: 0;
    top: 0;
  }

  .rz-audit-shell .rz-hero-title{
    font-size: 26px !important;
  }

  .rz-audit-shell .rz-owner-chip{
    max-width: min(320px, calc(100vw - 74px)) !important;
  }

  .rz-audit-tools{
    width: 100%;
    padding: 10px !important;
    border-radius: 24px !important;
    margin-top: 8px !important;
  }

  .rz-audit-tools .filters{
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  .rz-audit-tools #q,
  .rz-audit-tools #event_type,
  .rz-audit-tools #from,
  .rz-audit-tools #to{
    grid-column: 1 / -1;
  }

  .rz-audit-tools input,
  .rz-audit-tools select,
  .rz-audit-tools button,
  .rz-audit-tools select#status{
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    border-radius: 17px !important;
    font-size: 14px !important;
    line-height: 42px !important;
    padding: 0 12px !important;
    padding-bottom: 0 !important;
  }

  .rz-audit-table-wrap{
    width: 100%;
    border-radius: 18px;
    margin-top: 12px;
  }

  .rz-audit-table{
    min-width: 820px !important;
  }

  .rz-audit-status-line,
  .rz-audit-pager{
    width: 100%;
  }

  .rz-audit-modal-card{
    width: calc(100vw - 18px) !important;
    max-width: calc(100vw - 18px) !important;
    margin: 9px auto !important;
    max-height: calc(100dvh - 18px) !important;
    padding: 14px !important;
    border-radius: 22px !important;
  }

  .rz-audit-modal-head{
    align-items: flex-start;
  }

  .rz-audit-modal-summary{
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .rz-audit-meta-head button{
    flex: 1 1 150px;
  }
}


/* ================================================================== */
/* RAZAFI Audit modal open-position fix                               */
/* Scope: Audit modal UX only. No API/business logic changes.          */
/* ================================================================== */
body.rz-audit-modal-open{
  overflow: hidden !important;
}

body.rz-audit-modal-open .rz-bottom-nav{
  display: none !important;
}

#modal.modal:has(.rz-audit-modal-card),
#modal.modal.rz-audit-modal-open{
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: max(12px, env(safe-area-inset-top)) !important;
  padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
  overflow: hidden !important;
  overscroll-behavior: contain !important;
  z-index: 2147483000 !important;
}

#modal .rz-audit-modal-card{
  margin: 0 auto !important;
  max-height: calc(100dvh - 24px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-margin-top: 0 !important;
}

#modal .rz-audit-modal-head{
  position: sticky;
  top: 0;
  z-index: 5;
  padding-bottom: 10px;
  background: linear-gradient(180deg, #fff 70%, rgba(255,255,255,.92));
}

@media (max-width: 700px){
  #modal.modal:has(.rz-audit-modal-card),
  #modal.modal.rz-audit-modal-open{
    padding: 8px !important;
    align-items: flex-start !important;
  }

  #modal .rz-audit-modal-card{
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    margin: 0 auto !important;
  }
}

/* ================================================================== */
/* RAZAFI Plans modal open-position fix                               */
/* Scope: Plans modal UX only. No API/business logic changes.          */
/* Mirrors the stable Audit modal behavior with Plans-specific classes. */
/* ================================================================== */
body.rz-plans-modal-open{
  overflow: hidden !important;
}

body.rz-plans-modal-open .rz-bottom-nav{
  display: none !important;
}

#modal.modal:has(.rz-plans-modal-card),
#modal.modal.rz-plans-modal-open{
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: max(12px, env(safe-area-inset-top)) !important;
  padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
  overflow: hidden !important;
  overscroll-behavior: contain !important;
  z-index: 2147483000 !important;
}

#modal .rz-plans-modal-card{
  margin: 0 auto !important;
  width: min(680px, calc(100vw - 24px)) !important;
  max-width: min(680px, calc(100vw - 24px)) !important;
  max-height: calc(100dvh - 24px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  scroll-margin-top: 0 !important;
}

#modal .rz-plans-modal-card .modal-actions{
  position: sticky;
  bottom: 0;
  z-index: 5;
  background: linear-gradient(180deg, rgba(255,255,255,.88), #fff 38%);
  padding-top: 12px;
}

@media (max-width: 700px){
  #modal.modal:has(.rz-plans-modal-card),
  #modal.modal.rz-plans-modal-open{
    padding: 8px !important;
    align-items: flex-start !important;
  }

  #modal .rz-plans-modal-card{
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    margin: 0 auto !important;
  }
}



/* ================================================================== */
/* RAZAFI Clients modal iPhone-like polish                             */
/* Scope: Clients modal only. Keeps logic, read-only, flash animation. */
/* ================================================================== */
body.rz-clients-modal-open{
  overflow: hidden !important;
}

body.rz-clients-modal-open .rz-bottom-nav{
  display: none !important;
}

#modal .rz-clients-modal-card{
  width: min(900px, calc(100vw - 22px)) !important;
  max-width: min(900px, calc(100vw - 22px)) !important;
  margin: 10px auto !important;
  max-height: calc(100dvh - 20px) !important;
  overflow: auto !important;
  padding: 16px !important;
  border-radius: 28px !important;
  background: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(226,232,240,.88) !important;
  box-shadow: 0 24px 70px rgba(15,23,42,.28) !important;
  -webkit-overflow-scrolling: touch;
}

.rz-client-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding: 4px 2px 2px;
}

.rz-client-modal-title{
  margin:0 !important;
  text-align:left !important;
  color:#0f172a !important;
  font-size:24px !important;
  line-height:1.04 !important;
  font-weight:950 !important;
  letter-spacing:-.045em;
}

#modalSub{
  text-align:left !important;
  margin:6px 0 0 !important;
  color:#64748b !important;
  font-size:13px !important;
  font-weight:800;
}

.rz-client-close-btn{
  width:auto !important;
  min-height:38px !important;
  padding:0 13px !important;
  border-radius:999px !important;
  background:rgba(15,23,42,.06) !important;
  color:#0f172a !important;
  box-shadow:none !important;
  font-size:13px !important;
  flex:0 0 auto;
}

.rz-client-modal-separator{
  border:0;
  border-top:1px solid rgba(15,23,42,.08);
  margin:14px 0 !important;
}

#modal .rz-client-detail-grid{
  display:grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap:10px !important;
}

#modal .rz-detail-card{
  border:1px solid rgba(226,232,240,.9) !important;
  border-radius:20px !important;
  padding:12px 13px !important;
  background:linear-gradient(180deg, rgba(248,250,252,.96), rgba(255,255,255,.82)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}

#modal .rz-detail-label,
.rz-client-editor-label{
  font-size:11px !important;
  color:#64748b !important;
  font-weight:900 !important;
  letter-spacing:-.01em;
}

#modal .rz-detail-value{
  margin-top:4px;
  color:#0f172a;
  font-size:14px;
  font-weight:900;
  word-break:break-word;
}

.rz-client-editor-card{
  grid-column:1 / -1;
  padding:14px !important;
  border-radius:24px !important;
  border:1px solid rgba(226,232,240,.92) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.88)) !important;
  box-shadow:0 10px 26px rgba(15,23,42,.06);
}

.rz-client-editor-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

.rz-client-editor-controls{
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  flex:1 1 420px;
}

.rz-client-bonus-controls{
  display:grid !important;
  grid-template-columns: repeat(4, minmax(74px, 1fr)) minmax(180px, 1.3fr) auto;
  width:100%;
}

.rz-client-editor-current{
  margin-top:6px !important;
  color:#0f172a !important;
  font-size:13px !important;
  font-weight:900 !important;
}

.rz-client-editor-input{
  width:100% !important;
  min-height:42px !important;
  margin:0 !important;
  padding:0 12px !important;
  border-radius:16px !important;
  border:1px solid rgba(15,23,42,.10) !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow: inset 0 1px 2px rgba(15,23,42,.03) !important;
}

.rz-client-editor-input-small{ max-width:130px; }
.rz-client-editor-input-mini{ max-width:96px; }
.rz-client-editor-note{ min-width:180px; flex:1 1 220px; }

.rz-client-editor-btn{
  width:auto !important;
  min-height:42px !important;
  padding:0 15px !important;
  border-radius:16px !important;
  font-size:14px !important;
  font-weight:950 !important;
  box-shadow:0 10px 20px rgba(13,110,253,.15) !important;
}

.rz-client-checkline{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
  color:#334155;
  font-size:13px;
  font-weight:850;
  white-space:nowrap;
}

.rz-client-checkline input{
  width:18px !important;
  height:18px !important;
  min-height:18px !important;
  margin:0 !important;
  padding:0 !important;
  flex:0 0 auto;
}

#modal .modal-actions{
  position: static !important;
  display:flex !important;
  gap:10px !important;
  justify-content:flex-end !important;
  padding:14px 0 0 !important;
  margin-top:14px !important;
  background:transparent !important;
  border-top:1px solid rgba(15,23,42,.08) !important;
}

#modal .modal-actions button{
  min-height:44px !important;
  border-radius:18px !important;
  font-weight:950 !important;
}

@media (max-width:700px){
  #modal .rz-clients-modal-card{
    width:calc(100vw - 16px) !important;
    max-width:calc(100vw - 16px) !important;
    margin:8px auto !important;
    max-height:calc(100dvh - 16px) !important;
    padding:14px !important;
    border-radius:26px !important;
  }

  .rz-client-modal-head{
    gap:10px;
  }

  .rz-client-modal-title{
    font-size:22px !important;
  }

  #modal .rz-client-detail-grid{
    grid-template-columns:1fr !important;
    gap:9px !important;
  }

  #modal .rz-detail-card{
    padding:11px 12px !important;
    border-radius:18px !important;
  }

  .rz-client-editor-card{
    padding:12px !important;
    border-radius:22px !important;
  }

  .rz-client-editor-row{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:11px;
  }

  .rz-client-editor-controls,
  .rz-client-bonus-controls{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:9px !important;
    width:100%;
    flex:unset;
  }

  .rz-client-editor-note{
    min-width:0 !important;
    grid-column:1 / -1;
  }

  .rz-client-editor-input,
  .rz-client-editor-input-small,
  .rz-client-editor-input-mini{
    max-width:none !important;
    width:100% !important;
    min-height:42px !important;
  }

  .rz-client-editor-btn{
    grid-column:1 / -1;
    width:100% !important;
  }

  .rz-client-checkline{
    white-space:normal;
    align-items:center;
  }

  #modal .modal-actions{
    flex-direction:column;
  }

  #modal .modal-actions button{
    width:100% !important;
  }
}


/* ================================================================== */
/* Maintenance DB page (minimal, scoped)                               */
/* ================================================================== */
.rz-maintenance-shell{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.rz-maintenance-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
}
.rz-maintenance-card{
  border-radius:28px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(255,255,255,.90);
  box-shadow:var(--rz-shadow-card,0 12px 28px rgba(15,23,42,.08));
  padding:16px;
}
.rz-maintenance-title{
  margin:0 0 6px;
  font-size:18px;
  font-weight:950;
  letter-spacing:-.035em;
  color:var(--rz-text,#111827);
}
.rz-maintenance-muted{
  color:var(--rz-muted,#6b7280);
  font-size:13px;
  line-height:1.4;
  font-weight:750;
}
.rz-db-big{
  font-size:28px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.05em;
  margin:10px 0 6px;
}
.rz-db-progress-track{
  height:12px;
  border-radius:999px;
  background:rgba(15,23,42,.08);
  overflow:hidden;
  margin-top:10px;
}
.rz-db-progress-fill{
  height:100%;
  width:0%;
  border-radius:999px;
  background:linear-gradient(90deg,#0d6efd,#22c55e);
  transition:width .25s ease;
}
.rz-maintenance-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:12px;
}
.rz-maintenance-actions button{
  width:auto;
}
.rz-maintenance-option{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:13px 14px;
  border-radius:20px;
  background:rgba(248,250,252,.82);
  border:1px solid rgba(15,23,42,.08);
  margin-top:10px;
}
.rz-maintenance-option input{
  width:20px;
  height:20px;
  margin:1px 0 0;
  flex:0 0 20px;
  accent-color:#0d6efd;
}
.rz-maintenance-option-main{
  flex:1;
  min-width:0;
}
.rz-maintenance-option-label{
  font-weight:950;
  color:var(--rz-text,#111827);
}
.rz-maintenance-option-meta{
  margin-top:4px;
  color:var(--rz-muted,#6b7280);
  font-size:12px;
  font-weight:750;
  line-height:1.35;
}
.rz-maintenance-danger{
  border-color:rgba(239,68,68,.22);
  background:rgba(254,242,242,.78);
}
.rz-maintenance-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  margin-top:10px;
}
.rz-maintenance-table th,
.rz-maintenance-table td{
  padding:10px 8px;
  border-bottom:1px solid rgba(15,23,42,.08);
  text-align:left;
  font-size:13px;
}
.rz-maintenance-table th{
  color:var(--rz-muted,#6b7280);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.rz-maintenance-result{
  white-space:pre-wrap;
  background:#0b1220;
  color:#dbe7ff;
  border-radius:18px;
  padding:12px;
  overflow:auto;
  max-height:280px;
  font-size:12px;
  line-height:1.45;
  margin-top:10px;
}
@media (max-width:520px){
  .rz-maintenance-actions button{width:100%;}
  .rz-db-big{font-size:24px;}
}

/* ================================================================== */
/* RAZAFI Admin Login 2027 UX polish                                  */
/* Scope: login page only. No auth/session/business-logic changes.     */
/* ================================================================== */
body.rz-login-page{
  margin:0;
  min-height:100vh;
  color:#111827;
  background:
    radial-gradient(circle at 18% -8%, rgba(17,24,39,.08), transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(22,163,74,.07), transparent 28%),
    #f5f5f7;
}

body.rz-login-page .login-container{
  min-height:100vh;
  padding:22px 16px;
  align-items:center;
}

body.rz-login-page .card.rz-login-card{
  width:min(100%, 392px);
  padding:30px 24px 24px;
  border-radius:30px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.88);
  box-shadow:0 22px 55px rgba(15,23,42,.12);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.rz-login-title{
  margin:0;
  text-align:center;
  color:#111827 !important;
  font-size:28px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:-.055em;
}

.rz-login-subtitle{
  margin:9px 0 22px;
  text-align:center;
  color:#6b7280;
  font-size:14px;
  font-weight:750;
}

.rz-google-wrap{
  display:flex;
  justify-content:center;
  margin:4px 0 18px;
  min-height:44px;
}

.rz-login-divider{
  display:flex;
  align-items:center;
  gap:12px;
  margin:15px 0 18px;
  color:#9ca3af;
  font-size:12px;
  font-weight:850;
  text-transform:lowercase;
}

.rz-login-divider::before,
.rz-login-divider::after{
  content:"";
  flex:1;
  height:1px;
  background:rgba(17,24,39,.10);
}

body.rz-login-page form{
  margin:0;
}

body.rz-login-page input{
  margin-bottom:12px;
  padding:14px 15px;
  border-radius:17px;
  border:1px solid rgba(17,24,39,.10);
  background:rgba(248,250,252,.90);
  color:#111827;
  font-size:15px;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.03);
}

body.rz-login-page input:focus{
  outline:none;
  border-color:rgba(17,24,39,.34);
  box-shadow:0 0 0 4px rgba(17,24,39,.08), inset 0 1px 2px rgba(15,23,42,.03);
}

body.rz-login-page button[type="submit"]{
  margin-top:2px;
  padding:14px;
  border-radius:17px;
  background:#1f1f1f !important;
  color:#fff;
  border:0;
  font-weight:900;
  letter-spacing:-.02em;
  box-shadow:0 12px 24px rgba(17,24,39,.18);
}

body.rz-login-page button[type="submit"]:hover{
  background:#111827 !important;
  filter:none;
  transform:translateY(-1px);
}

body.rz-login-page button[type="submit"]:active{
  transform:translateY(0);
}

.rz-login-footer{
  margin-top:20px;
  padding-top:16px;
  border-top:1px solid rgba(17,24,39,.08);
  text-align:center;
  color:#6b7280;
  font-size:13px;
  line-height:1.4;
}

.rz-login-footer strong{
  display:block;
  color:#374151;
  font-size:13px;
  font-weight:850;
  margin-bottom:5px;
}

.rz-login-whatsapp-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:7px;
  color:#111827;
  text-decoration:none;
  font-weight:900;
  border-bottom:1px solid rgba(17,24,39,.32);
}

.rz-login-whatsapp-link:hover{
  color:#000;
  border-bottom-color:#000;
}

body.rz-login-page .error{
  min-height:18px;
  margin-top:12px;
  color:#dc2626;
  font-size:13px;
  font-weight:750;
}

@media (max-width:520px){
  body.rz-login-page .login-container{
    padding:14px 12px;
  }
  body.rz-login-page .card.rz-login-card{
    padding:26px 18px 20px;
    border-radius:28px;
  }
  .rz-login-title{
    font-size:26px;
  }
}


/* ------------------------------------------------------------------ */
/* RAZAFI Admin — Portal preview shortcut + pool picker                 */
/* ------------------------------------------------------------------ */
.rz-bottom-nav{
  grid-template-columns: repeat(5, 1fr) !important;
}

.rz-bottom-action{
  appearance:none;
  border:0;
  background:transparent;
  cursor:pointer;
  width:auto;
  padding:0;
  font-family:inherit;
}

.rz-bottom-action:disabled{
  opacity:.62;
  cursor:wait;
}

.rz-portal-picker-overlay{
  position:fixed;
  inset:0;
  z-index:100001;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(15,23,42,.46);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.rz-portal-picker-card{
  width:min(440px, calc(100vw - 30px));
  max-height:min(620px, calc(100dvh - 42px));
  overflow:auto;
  border-radius:28px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(226,232,240,.86);
  box-shadow:0 28px 80px rgba(15,23,42,.28);
  padding:16px;
}

.rz-portal-picker-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.rz-portal-picker-title{
  font-size:18px;
  line-height:1.15;
  font-weight:950;
  color:#0f172a;
  letter-spacing:-.03em;
}

.rz-portal-picker-sub{
  margin-top:4px;
  color:#64748b;
  font-size:13px;
  line-height:1.35;
  font-weight:700;
}

.rz-portal-picker-close{
  width:38px;
  min-width:38px;
  height:38px;
  padding:0;
  border-radius:999px;
  border:0;
  background:#f1f5f9;
  color:#334155;
  font-size:24px;
  line-height:1;
  font-weight:850;
}

.rz-portal-picker-list{
  display:grid;
  gap:9px;
}

.rz-portal-picker-item{
  width:100%;
  min-height:58px;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(226,232,240,.92);
  background:#fff;
  color:#0f172a;
  text-align:left;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:2px;
  box-shadow:0 8px 22px rgba(15,23,42,.06);
}

.rz-portal-picker-item:active{
  transform:scale(.99);
}

.rz-portal-picker-name{
  font-size:15px;
  font-weight:950;
  letter-spacing:-.02em;
}

.rz-portal-picker-nas{
  font-size:12px;
  font-weight:800;
  color:#64748b;
}

.rz-portal-picker-cancel{
  width:100%;
  margin-top:12px;
  min-height:44px;
  border-radius:999px;
  background:#e2e8f0;
  color:#334155;
  font-weight:950;
}

@media (max-width:420px){
  .rz-bottom-nav{
    width:calc(100vw - 14px) !important;
    padding:6px !important;
    gap:3px !important;
  }
  .rz-bottom-item{
    font-size:9.3px !important;
    min-height:48px !important;
  }
  .rz-bottom-icon,
  .rz-bottom-icon svg{
    width:19px !important;
    height:19px !important;
  }
  .rz-portal-picker-overlay{
    align-items:flex-end;
    padding:12px;
  }
  .rz-portal-picker-card{
    width:100%;
    border-radius:28px 28px 22px 22px;
    padding-bottom:calc(16px + env(safe-area-inset-bottom));
  }
}

/* ============================================================
   RAZAFI ADMIN ASSISTANT WIDGET — V2
   Light Apple/iPhone style matching RAZAFI admin design language.
   Uses existing CSS custom properties (--rz-*).
   Z-index budget:
     backdrop: 9994
     FAB:      9996  (below bottom nav ~99999, above page content)
     Panel:    9995  (above content, below FAB and nav)
   When drawer is open all assistant elements drop to z-index:1.
   ============================================================ */

/* FAB — floating action button, bottom-right */
.rz-aa-fab {
  position: fixed;
  bottom: calc(88px + 14px);  /* bottom nav height ~88px + gap */
  right: 14px;
  z-index: 9996;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 9px 16px 9px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.90);
  border: 1px solid rgba(17,24,39,.10);
  box-shadow: 0 8px 22px rgba(15,23,42,.14), 0 2px 6px rgba(15,23,42,.07);
  color: var(--rz-text);
  font-size: 14px;
  font-weight: 850;
  cursor: pointer;
  white-space: nowrap;
  transition: box-shadow 0.15s, transform 0.12s, background 0.12s;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.rz-aa-fab:active,
.rz-aa-fab.rz-active {
  background: rgba(255,255,255,.98);
  box-shadow: 0 12px 32px rgba(13,110,253,.15), 0 2px 6px rgba(15,23,42,.07);
  transform: scale(0.97);
}
.rz-aa-fab-label {
  font-size: 13px;
  font-weight: 800;
}

/* Backdrop */
.rz-aa-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9994;
  background: rgba(15,23,42,.18);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
.rz-aa-backdrop.rz-open {
  display: block;
}

/* Panel — bottom-sheet, slides up */
.rz-aa-panel {
  position: fixed;
  left: 50%;
  transform: translateX(-50%) translateY(105%);
  bottom: 0;
  width: min(480px, 100vw);
  max-height: 62vh;
  z-index: 9995;
  display: flex;
  flex-direction: column;
  overflow: hidden;

  background: rgba(255,255,255,.96);
  border: 1px solid rgba(17,24,39,.09);
  border-radius: 26px 26px 0 0;
  box-shadow: 0 -8px 40px rgba(15,23,42,.12), 0 -2px 8px rgba(15,23,42,.06);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
  backdrop-filter: blur(22px) saturate(1.2);

  transition: transform 0.30s cubic-bezier(.32,1,.28,1);
}
.rz-aa-panel.rz-open {
  transform: translateX(-50%) translateY(0);
}

/* Panel header */
.rz-aa-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
  border-bottom: 1px solid rgba(17,24,39,.07);
  flex-shrink: 0;
}
.rz-aa-title {
  font-size: 15px;
  font-weight: 900;
  color: var(--rz-text);
  letter-spacing: -0.02em;
}
.rz-aa-sub {
  font-size: 12px;
  color: var(--rz-muted);
  margin-top: 2px;
}
.rz-aa-close {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(17,24,39,.07);
  border: none;
  color: var(--rz-muted);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
  line-height: 1;
  transition: background 0.12s;
}
.rz-aa-close:active {
  background: rgba(17,24,39,.14);
}

/* Messages area */
.rz-aa-body {
  flex: 1;
  overflow-y: auto;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  -webkit-overflow-scrolling: touch;
}

/* Message bubbles */
.rz-aa-msg {
  padding: 9px 13px;
  border-radius: 18px;
  font-size: 14px;
  line-height: 1.45;
  max-width: 88%;
  word-break: break-word;
  color: var(--rz-text);
}
.rz-aa-msg-assistant {
  background: rgba(13,110,253,.08);
  border: 1px solid rgba(13,110,253,.12);
  border-bottom-left-radius: 6px;
  align-self: flex-start;
  white-space: pre-line; /* render \n as line breaks in multi-line dynamic answers */
}
.rz-aa-msg-user {
  background: var(--rz-text);
  color: #ffffff;
  border-bottom-right-radius: 6px;
  align-self: flex-end;
}
.rz-aa-msg-thinking {
  background: rgba(17,24,39,.06);
  border: 1px solid rgba(17,24,39,.08);
  color: var(--rz-muted);
  font-style: italic;
  align-self: flex-start;
  border-bottom-left-radius: 6px;
}

/* Response chips (KB buttons, display-only) */
.rz-aa-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 2px 14px 6px;
  align-self: flex-start;
}
.rz-aa-chip {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid rgba(13,110,253,.20);
  background: rgba(13,110,253,.07);
  color: var(--rz-blue);
  font-size: 12.5px;
  font-weight: 700;
  white-space: nowrap;
  cursor: default;
}

/* Input row */
.rz-aa-input-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px calc(10px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(17,24,39,.07);
  flex-shrink: 0;
}
.rz-aa-input {
  flex: 1;
  background: rgba(17,24,39,.05);
  border: 1px solid rgba(17,24,39,.10);
  border-radius: 20px;
  color: var(--rz-text);
  font-size: 14px;
  padding: 9px 14px;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
  -webkit-appearance: none;
}
.rz-aa-input::placeholder {
  color: var(--rz-muted);
  opacity: 0.7;
}
.rz-aa-input:focus {
  border-color: rgba(13,110,253,.45);
  box-shadow: 0 0 0 4px rgba(13,110,253,.10);
}
.rz-aa-send {
  flex-shrink: 0;
  height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--rz-blue), #2563eb);
  border: none;
  color: #fff;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
  transition: opacity 0.15s, transform 0.12s;
  white-space: nowrap;
}
.rz-aa-send:disabled {
  background: rgba(17,24,39,.10);
  color: var(--rz-muted);
  cursor: not-allowed;
  opacity: 0.7;
}
.rz-aa-send:not(:disabled):active {
  transform: scale(0.95);
}

/* When drawer is open, push everything behind it */
body.rz-drawer-open .rz-aa-panel,
body.rz-drawer-open .rz-aa-fab,
body.rz-drawer-open .rz-aa-backdrop {
  z-index: 1 !important;
}

/* Safe area support for iPhone home bar */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .rz-aa-fab {
    bottom: calc(88px + 14px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 420px) {
  .rz-aa-fab {
    right: 10px;
    padding: 8px 13px 8px 10px;
    font-size: 13px;
  }
  .rz-aa-panel {
    border-radius: 22px 22px 0 0;
    max-height: 68vh;
  }
  .rz-aa-msg {
    font-size: 13.5px;
  }
}

/* ============================================================
   RAZAFI ADMIN ASSISTANT WIDGET — V2 HOTFIX
   Fixes global button { width:100% } and body.rz-admin-shell
   button rules bleeding into .rz-aa-fab and inner buttons.
   All rules use !important to win the specificity war cleanly.
   Append-only — no existing rules modified.
   ============================================================ */

/* ---- FAB: force compact pill shape, override global button rules ---- */
.rz-aa-fab,
body.rz-admin-shell .rz-aa-fab {
  /* Override global button { width:100% } and rz-admin-shell button rules */
  width: auto !important;
  min-width: 0 !important;
  max-width: max-content !important;

  /* Restore pill geometry (global button resets border-radius to 10px) */
  border-radius: 999px !important;

  /* Restore compact sizing */
  padding: 9px 16px 9px 12px !important;
  height: auto !important;
  min-height: 0 !important;

  /* Light Apple frosted style — override global button { background:#0d6efd } */
  background: rgba(255,255,255,.92) !important;
  color: var(--rz-text) !important;
  border: 1px solid rgba(17,24,39,.10) !important;
  box-shadow: 0 8px 22px rgba(15,23,42,.14), 0 2px 6px rgba(15,23,42,.07) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;

  /* Positioning — fixed, above bottom nav */
  position: fixed !important;
  bottom: calc(88px + 14px) !important;
  right: 14px !important;
  left: auto !important;
  top: auto !important;
  z-index: 9996 !important;

  /* Layout */
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;

  /* Typography */
  font-size: 14px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;

  /* Behavior */
  cursor: pointer !important;
  transition: box-shadow 0.15s, transform 0.12s, background 0.12s !important;

  /* Prevent hover state from global button:hover { background:#0b5ed7 } */
  text-decoration: none !important;
}

.rz-aa-fab:hover,
body.rz-admin-shell .rz-aa-fab:hover {
  background: rgba(255,255,255,.98) !important;
  box-shadow: 0 12px 32px rgba(13,110,253,.12), 0 2px 6px rgba(15,23,42,.07) !important;
}

.rz-aa-fab:active,
.rz-aa-fab.rz-active,
body.rz-admin-shell .rz-aa-fab:active,
body.rz-admin-shell .rz-aa-fab.rz-active {
  background: rgba(255,255,255,.98) !important;
  box-shadow: 0 12px 32px rgba(13,110,253,.15), 0 2px 6px rgba(15,23,42,.07) !important;
  transform: scale(0.97) !important;
}

/* ---- Backdrop: only blur/dim when panel is actually open ---- */
/* Reset backdrop-filter on the hidden state so it never bleeds through */
.rz-aa-backdrop {
  display: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: transparent !important;
}
.rz-aa-backdrop.rz-open {
  display: block !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
  background: rgba(15,23,42,.18) !important;
}

/* ---- Inner buttons: prevent global button rules from breaking the panel ---- */

/* Close button — small circle, not full-width */
.rz-aa-close,
body.rz-admin-shell .rz-aa-close {
  width: 28px !important;
  min-width: 0 !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: rgba(17,24,39,.07) !important;
  border: none !important;
  color: var(--rz-muted) !important;
  box-shadow: none !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.rz-aa-close:hover,
body.rz-admin-shell .rz-aa-close:hover {
  background: rgba(17,24,39,.13) !important;
}
.rz-aa-close:active,
body.rz-admin-shell .rz-aa-close:active {
  background: rgba(17,24,39,.18) !important;
}

/* Send button — compact pill, right side of input row */
.rz-aa-send,
body.rz-admin-shell .rz-aa-send {
  flex-shrink: 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: max-content !important;
  height: 36px !important;
  min-height: 0 !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--rz-blue), #2563eb) !important;
  border: none !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: opacity 0.15s, transform 0.12s !important;
}
.rz-aa-send:disabled,
body.rz-admin-shell .rz-aa-send:disabled {
  background: rgba(17,24,39,.10) !important;
  color: var(--rz-muted) !important;
  cursor: not-allowed !important;
  opacity: 0.7 !important;
  box-shadow: none !important;
}
.rz-aa-send:not(:disabled):hover,
body.rz-admin-shell .rz-aa-send:not(:disabled):hover {
  background: linear-gradient(135deg, #0b5ed7, #1d4ed8) !important;
}
.rz-aa-send:not(:disabled):active,
body.rz-admin-shell .rz-aa-send:not(:disabled):active {
  transform: scale(0.95) !important;
}

/* ---- Panel: not affected by global button rules but reinforce key props ---- */
.rz-aa-panel {
  /* Ensure the panel itself is never touched by button or body rules */
  width: min(480px, 100vw) !important;
  background: rgba(255,255,255,.97) !important;
}

/* ---- Safe-area and mobile overrides ---- */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .rz-aa-fab,
  body.rz-admin-shell .rz-aa-fab {
    bottom: calc(88px + 14px + env(safe-area-inset-bottom)) !important;
  }
}

@media (max-width: 420px) {
  .rz-aa-fab,
  body.rz-admin-shell .rz-aa-fab {
    right: 10px !important;
    bottom: calc(80px + 10px) !important;
    padding: 8px 13px 8px 10px !important;
    font-size: 13px !important;
  }
}

/* ============================================================
   RAZAFI ADMIN ASSISTANT WIDGET — V2 Z-INDEX FIX
   Problem: .rz-bottom-nav has z-index:99999 !important (line ~1876)
   which covers the panel's input row when the panel is open.

   Fix: raise panel and backdrop z-index ONLY when panel is open
   (.rz-open class is added by nav.js openPanel()).

   Z-index ladder (ascending):
     page content          1–1000
     sticky bars           20–25
     bottom-nav            99999  (!important, hardcoded)
     backdrop.rz-open      100000 (dims bottom-nav correctly)
     portal-picker         100001
     panel.rz-open         100002 (input row now above bottom-nav)
     drawer overlay        2147482000  (drawer always wins)
     drawer                2147482500  (drawer always wins)

   When drawer opens: existing rule drops panel/backdrop to z-index:1
   so the drawer correctly overlays everything.
   ============================================================ */

/* Open panel must be above bottom-nav (99999 !important) */
.rz-aa-panel.rz-open {
  z-index: 100002 !important;
}

/* Backdrop when open: above bottom-nav so it dims it, below panel */
.rz-aa-backdrop.rz-open {
  z-index: 100000 !important;
}

/* FAB: hide it under the open backdrop so it doesn't float above the panel */
/* (FAB is at 9996, backdrop.rz-open is 100000 — FAB is already hidden.
   This rule is a no-op safety net in case a future rule raises FAB z-index.) */
body:has(.rz-aa-panel.rz-open) .rz-aa-fab {
  z-index: 100 !important;
}

/* ============================================================
   RAZAFI ADMIN — PHASE 1 "Depuis votre dernière visite" card
   v2: mobile-first compact redesign.
   Scope: .rz-since-* only. Append-only. No existing rules modified.

   Two states:
   A) has_new_data=true  → .rz-since-card.rz-since-has-new  (~80-95px mobile)
   B) has_new_data=false → .rz-since-pill                    (~44-52px mobile)
   ============================================================ */

/* ── A. HAS NEW DATA card ──────────────────────────────────── */

.rz-since-card {
  padding: 11px 14px 10px;
  border-radius: var(--rz-radius-lg);           /* 22px — slightly tighter than pool cards */
  background: linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,255,255,.90));
  border: 1px solid rgba(255,255,255,.92);
  border-left: 3px solid var(--rz-blue);
  box-shadow: var(--rz-shadow-card);
}

/* Top row: label + relative time */
.rz-since-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.rz-since-title {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--rz-muted);
}

.rz-since-time {
  font-size: 11px;
  font-weight: 700;
  color: var(--rz-muted);
  opacity: 0.75;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Chips + button on one wrapping row */
.rz-since-chips-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

/* Value chips — shared base */
.rz-since-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
  line-height: 1.3;
}

.rz-since-chip-green {
  background: var(--rz-green-soft);
  color: var(--rz-green);
  border: 1px solid rgba(22,163,74,.18);
}

.rz-since-chip-blue {
  background: var(--rz-blue-soft);
  color: var(--rz-blue);
  border: 1px solid rgba(13,110,253,.18);
}

/* "Vu" button — small pill, pushed to end of chips row via margin-left:auto */
.rz-since-btn,
body.rz-admin-shell .rz-since-btn {
  margin-left: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: max-content !important;
  padding: 4px 13px !important;
  border-radius: 999px !important;
  background: var(--rz-blue) !important;
  border: none !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  box-shadow: 0 2px 8px rgba(13,110,253,.22) !important;
  transition: opacity 0.15s, transform 0.12s !important;
  white-space: nowrap !important;
  line-height: 1.4 !important;
  flex-shrink: 0 !important;
}

.rz-since-btn:hover,
body.rz-admin-shell .rz-since-btn:hover {
  background: #0b5ed7 !important;
  box-shadow: 0 4px 12px rgba(13,110,253,.30) !important;
}

.rz-since-btn:active,
body.rz-admin-shell .rz-since-btn:active {
  transform: scale(0.96) !important;
}

.rz-since-btn:disabled,
body.rz-admin-shell .rz-since-btn:disabled {
  background: rgba(17,24,39,.12) !important;
  color: var(--rz-muted) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* ── B. EMPTY STATE pill ───────────────────────────────────── */

.rz-since-pill {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 11px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(22,163,74,.18);
  box-shadow: 0 2px 8px rgba(15,23,42,.05);
  min-height: 44px;
}

.rz-since-pill-check {
  font-size: 13px;
  color: var(--rz-green);
  font-weight: 900;
  flex-shrink: 0;
  line-height: 1;
}

.rz-since-pill-text {
  font-size: 12.5px;
  font-weight: 800;
  color: var(--rz-muted);
  flex: 1;
}

/* rz-since-time reused inside pill — same token */
.rz-since-pill .rz-since-time {
  font-size: 11px;
  opacity: 0.65;
}

/* ============================================================
   RAZAFI ADMIN — PHASE 1 animations
   v1: iPhone-style entrance animations.
   Scope: .rz-since-* only. Append-only. No existing rules modified.

   Rules:
   · One-shot only (animation-iteration-count: 1, no looping)
   · animation-fill-mode: both  → elements start invisible,
     freeze at final frame after completing
   · Max 6px translateY, scale 0.98→1 maximum
   · Durations 260–480ms, spring / decelerate cubics
   · prefers-reduced-motion block disables everything at the end
   ============================================================ */

/* ── Keyframes ────────────────────────────────────────────── */

/* Pill container + card top-row: fade + gentle slide up */
@keyframes rzSinceFadeUp {
  from { opacity: 0; transform: translateY(5px); }
  to   { opacity: 1; transform: translateY(0);   }
}

/* Has-new card container: fade + scale + slide */
@keyframes rzSinceCardIn {
  from { opacity: 0; transform: translateY(6px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0)   scale(1);    }
}

/* Empty-state pill container: same motion, slightly springier */
@keyframes rzSincePillIn {
  from { opacity: 0; transform: translateY(5px) scale(0.99); }
  to   { opacity: 1; transform: translateY(0)   scale(1);    }
}

/* Chips + "Vu" button: compact pop-in */
@keyframes rzSinceChipIn {
  from { opacity: 0; transform: translateY(4px) scale(0.94); }
  to   { opacity: 1; transform: translateY(0)   scale(1);    }
}

/* Checkmark: spring pop — the only element with visible overshoot */
@keyframes rzSinceCheckPop {
  0%   { opacity: 0; transform: scale(0.45); }
  55%  { opacity: 1; transform: scale(1.20); }
  78%  { transform: scale(0.91);             }
  100% { opacity: 1; transform: scale(1);    }
}

/* Attention pulse: runs twice after entrance, then stops forever.
   scale stays within 1→1.010, glow ring is barely perceptible.
   Peak sits at 45% so the inhale is slightly slower than the exhale
   — feels more like a resting heartbeat than an alert. */
@keyframes rzSincePulse {
  0%   {
    transform:  scale(1);
    box-shadow: var(--rz-shadow-card);
  }
  45%  {
    transform:  scale(1.010);
    box-shadow: var(--rz-shadow-card), 0 0 0 5px rgba(13, 110, 253, 0.07);
  }
  100% {
    transform:  scale(1);
    box-shadow: var(--rz-shadow-card);
  }
}

/* ── B. Empty-state pill animations ──────────────────────── */

.rz-since-pill {
  animation: rzSincePillIn 360ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* Checkmark pops in after the pill lands */
.rz-since-pill-check {
  animation: rzSinceCheckPop 400ms cubic-bezier(0.34, 1.30, 0.64, 1) 160ms both;
}

/* ── A. Has-new card animations ───────────────────────────── */

/* Card shell: entrance, then a two-beat attention pulse once chips have landed.
   rzSincePulse is listed second so it wins on transform during its active period.
   Delay 700ms = 75ms stillness after the last chip/button finishes at 625ms. */
.rz-since-card.rz-since-has-new {
  animation:
    rzSinceCardIn 380ms cubic-bezier(0.22, 1, 0.36, 1) both,
    rzSincePulse  1.4s  ease-in-out                    700ms 2 forwards;
}

/* Top label row fades in just after the card shell */
.rz-since-has-new .rz-since-top {
  animation: rzSinceFadeUp 280ms cubic-bezier(0.22, 1, 0.36, 1) 80ms both;
}

/* Chips stagger in one by one */
.rz-since-chips-row .rz-since-chip:nth-child(1) {
  animation: rzSinceChipIn 260ms cubic-bezier(0.34, 1.20, 0.64, 1) 140ms both;
}
.rz-since-chips-row .rz-since-chip:nth-child(2) {
  animation: rzSinceChipIn 260ms cubic-bezier(0.34, 1.20, 0.64, 1) 215ms both;
}
.rz-since-chips-row .rz-since-chip:nth-child(3) {
  animation: rzSinceChipIn 260ms cubic-bezier(0.34, 1.20, 0.64, 1) 290ms both;
}

/* "Vu" button appears after the last possible chip */
.rz-since-chips-row .rz-since-btn {
  animation: rzSinceChipIn 260ms cubic-bezier(0.34, 1.20, 0.64, 1) 365ms both;
}

/* ── prefers-reduced-motion ───────────────────────────────── */
/* Disable all rz-since animations for users who prefer reduced motion.
   Transitions on :hover/:active states are also cleared for completeness. */
@media (prefers-reduced-motion: reduce) {
  .rz-since-pill,
  .rz-since-pill-check,
  .rz-since-card.rz-since-has-new,
  .rz-since-has-new .rz-since-top,
  .rz-since-chips-row .rz-since-chip:nth-child(1),
  .rz-since-chips-row .rz-since-chip:nth-child(2),
  .rz-since-chips-row .rz-since-chip:nth-child(3),
  .rz-since-chips-row .rz-since-btn {
    animation: none !important;
  }
  .rz-since-btn,
  body.rz-admin-shell .rz-since-btn {
    transition: none !important;
  }
}


/* ============================================================= */
/* RAZAFI — Pool modal: "Modes de paiement du portail" (per pool) */
/* Scope: admin pool edit modal only. iPhone-style toggle cards.  */
/* Defensive fallback styles for .rz-modal-section / -title in    */
/* case they are not already styled elsewhere.                    */
/* ============================================================= */
.rz-modal-section {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(118, 118, 128, 0.14);
}
.rz-modal-section:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.rz-modal-section-title {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -0.01em;
  opacity: 0.82;
  margin-bottom: 10px;
}

.rz-pay-methods-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 420px) {
  .rz-pay-methods-grid { grid-template-columns: 1fr; }
}

.rz-pay-method-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(118, 118, 128, 0.16);
  box-shadow: 0 4px 10px rgba(17, 24, 39, 0.05);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.12s ease;
}
.rz-pay-method-card:active { transform: scale(0.98); }
.rz-pay-method-card.is-on {
  border-color: rgba(52, 199, 89, 0.55);
  box-shadow: 0 8px 18px rgba(52, 199, 89, 0.12);
}
.rz-pay-method-card input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}
.rz-pay-method-logo {
  flex: 0 0 auto;
  width: 44px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden;
  background: rgba(118, 118, 128, 0.06);
}
.rz-pay-method-logo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}
/* Broken/missing logo: hide the whole frame, keep the text label visible. */
.rz-pay-method-logo.is-logo-missing {
  display: none !important;
}
.rz-pay-method-name {
  flex: 1 1 auto;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.01em;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rz-pay-method-switch {
  flex: 0 0 auto;
  position: relative;
  width: 40px;
  height: 24px;
  border-radius: 999px;
  background: rgba(118, 118, 128, 0.28);
  transition: background 0.18s ease;
}
.rz-pay-method-switch::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.18);
  transition: transform 0.18s ease;
}
.rz-pay-method-card.is-on .rz-pay-method-switch {
  background: #34c759;
}
.rz-pay-method-card.is-on .rz-pay-method-switch::after {
  transform: translateX(16px);
}
.rz-pay-method-card:has(input:disabled) {
  opacity: 0.55;
  cursor: not-allowed;
}

.rz-pay-methods-note {
  margin-top: 8px;
  font-size: 11.5px;
  opacity: 0.62;
  line-height: 1.35;
}