/* ============================================================================
   FIBONIQ PROP — SHARED fused-input layer (fbqc-admin.css)
   Deploy to: assets/css/fbqc-admin.css
   ★ (client V2) — originally admin-only; now loaded by BOTH portals
   (admin/header.php AND the client header.php), AFTER the shared fbqc.css.
   Selectors are portal-agnostic: .modal .input-group / .fbqc-ov .input-group
   fused one-box shells, plain accent .edit-button chips, .fbqc-langsearch.
   Cache protocol: bump ?v=admN in BOTH headers on EVERY edit to this file.
   ========================================================================== */

/* ===================== §9 FUSED INPUT-GROUPS — one box, icons INSIDE =====
   ★ FIX (admin R2) — fbqc.css's modal skin gives EVERY .form-control its own
   1.5px border, so input-groups (search icon + input, password + eye chip,
   phone code + number) rendered as 2–3 separate boxes. Per design system §9:
   ONE outline on the .input-group shell (1.5px, radius 12, overflow hidden);
   all children go borderless/transparent; eye/edit chips become PLAIN accent
   icons inside the shell. Focus ring moves to the shell (:focus-within).   */
.modal .input-group,
.fbqc-ov .input-group{
  border:1.5px solid var(--fbqc-bd)!important; border-radius:12px!important; overflow:hidden;
  background:var(--fbqc-card); align-items:stretch;
  transition:border-color .15s, box-shadow .15s;
}
.modal .input-group:focus-within,
.fbqc-ov .input-group:focus-within{ border-color:var(--fbqc-o)!important; box-shadow:0 0 0 4px var(--fbqc-soft); }

.modal .input-group > .form-control, .modal .input-group > .form-select,
.modal .input-group > .input-group-text, .modal .input-group > .btn,
.fbqc-ov .input-group > .form-control, .fbqc-ov .input-group > .form-select,
.fbqc-ov .input-group > .input-group-text, .fbqc-ov .input-group > .btn{
  border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important;
}
.modal .input-group > .form-control, .modal .input-group > .form-select,
.fbqc-ov .input-group > .form-control, .fbqc-ov .input-group > .form-select{ min-height:46px; }
.modal .input-group > .form-control:focus, .modal .input-group > .form-select:focus,
.fbqc-ov .input-group > .form-control:focus, .fbqc-ov .input-group > .form-select:focus{ border:0!important; box-shadow:none!important; }
.modal .input-group .input-group-text,
.fbqc-ov .input-group .input-group-text{ color:var(--fbqc-mut); }

/* eye / pencil chips (.edit-button) — legacy update-styles gives them their
   own bordered chip; force-reset to a PLAIN accent icon inside the shell.  */
.modal .input-group .edit-button,
.fbqc-ov .input-group .edit-button{
  border:0!important; background:transparent!important; border-radius:0!important;
  position:static!important; display:flex!important; align-items:center; justify-content:center;
  padding:0 14px!important; color:var(--fbqc-o)!important; cursor:pointer; font-size:19px;
}

/* select2 inside a fused group (phone country-code): flatten its box too,
   keep a soft divider between the code and the number field. */
.modal .input-group .select2-container,
.fbqc-ov .input-group .select2-container{ flex:0 0 auto; width:auto!important; max-width:46%; }
.modal .input-group .select2-container .select2-selection,
.fbqc-ov .input-group .select2-container .select2-selection{
  border:0!important; background:transparent!important; border-radius:0!important; box-shadow:none!important;
  min-height:46px; height:100%; display:flex; align-items:center;
}
.modal .input-group .select2-container .select2-selection__rendered,
.fbqc-ov .input-group .select2-container .select2-selection__rendered{ color:var(--fbqc-ink)!important; }
.modal .input-group .select2-container + .form-control,
.fbqc-ov .input-group .select2-container + .form-control{ border-inline-start:1px solid var(--fbqc-bd-soft)!important; }
