/* /css/settings.css – UI בסיסי להגדרות */
.ci-settings__tabs {
  display: flex; gap: 6px; padding: 0 0 8px 0; border-bottom: 1px solid #eee; margin-bottom: 12px;
}
.ci-settings__tab {
  border: 0; background: #f5f5f5; padding: 8px 12px; border-radius: 10px; cursor: pointer; font: 600 14px system-ui;
}
.ci-settings__tab[aria-selected="true"] { background: #e9e9e9; }
.ci-settings__panel { display: none; }
.ci-settings__panel[aria-hidden="false"] { display: block; }

.ci-field { margin: 10px 0; }
.ci-field label { font: 600 14px system-ui; display: block; margin-bottom: 6px; }
.ci-muted { color: #666; font-size: 13px; }
.ci-inline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.ci-badge {
  display: inline-block; padding: 4px 8px; border-radius: 999px; background: #f2f2f2; font: 600 12px system-ui; color: #444;
}
.ci-badge--ok { background: #e6ffed; color: #216e39; }
.ci-badge--warn { background: #fff7e6; color: #ad6800; }

.ci-settings__footer {
  display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px;
}
/* ==== Couple page tweaks: tabs on one line + mobile scroll ==== */
.ci-settings__tabs{
  display:flex; gap:8px; padding:0 0 8px 0; border-bottom:1px solid #eee; margin-bottom:12px;
  flex-wrap: nowrap;            /* לא לשבור שורה */
  overflow: auto;               /* גלילה אופקית במובייל */
  white-space: nowrap;
  scrollbar-width: none;        /* פיירפוקס: להסתיר סקולבר */
}
.ci-settings__tabs::-webkit-scrollbar{ display:none; } /* כרום/ספארי */
.ci-settings__tab{ flex: 0 0 auto; }                   /* כפתורים לא “נמתחים” */
/* ==== Compact radio list spacing inside settings panels ==== */
.ci-settings__panel label{
  display:flex; align-items:center; gap:10px;
  margin: 6px 0;                /* רווח קטן ואחיד */
  line-height: 1.2;
}
.ci-settings__panel input[type="radio"]{
  margin: 0;                     /* אל תוסיף רווח ברירת מחדל */
  transform: translateY(0);      /* לאזן ריווח אנכי */
}

/* ===== Couple settings — compact & aligned ===== */

/* מיכל הלשוניות (הכותרות “הרשאות/וידאו/סוג קובץ/התראות”) */
.cpl-card .ci-tabs,
.cpl-card .tabs,
.cpl-card .settings-tabs {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  padding: 4px 2px !important;
  -webkit-overflow-scrolling: touch !important;
}

/* הכפתורים של הלשוניות – אחיד כמו באתר הראשי */
.cpl-card .ci-tabs .tab-btn,
.cpl-card .tabs .tab-btn,
.cpl-card .settings-tabs .tab-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  padding: .55rem 1rem !important;
  border-radius: 14px !important;
}

/* מצב פעיל ללשונית */
.cpl-card .ci-tabs .tab-btn.active,
.cpl-card .tabs .tab-btn.active,
.cpl-card .settings-tabs .tab-btn.active {
  /* המחלקה .active כבר מקבלת bg-brand וכו' מ-styles.css – זה רק לוודא קונטרסט */
  box-shadow: 0 2px 10px rgba(0,0,0,.08) !important;
}

/* צמצום ריווחים בין קבוצות ההגדרה */
.cpl-card .settings-section,
.cpl-card .ci-section {
  margin-top: 10px !important;
}

/* רשימות רדיו – פחות ריווח אנכי */
.cpl-card .settings-list,
.cpl-card .ci-list,
.cpl-card .settings-radios,
.cpl-card .ci-radios {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important; /* במקום רווחים גדולים */
}

/* כל שורה של רדיו: מיושר וצמוד יותר */
.cpl-card .settings-radio,
.cpl-card .ci-radio,
.cpl-card .settings-list .row,
.cpl-card .ci-list .row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
}

/* הכותרות המשניות (כמו “איכות צילום”) – ריווח מתון */
.cpl-card h4, .cpl-card .subhead, .cpl-card .section-title {
  margin: 14px 0 8px !important;
}

/* הסברים מתחת לשדות – אות קטנה וריווח קטן */
.cpl-card .muted, .cpl-card .help, .cpl-card .tip {
  font-size: .9rem !important;
  line-height: 1.35 !important;
  margin-top: 6px !important;
}