/* ── Talent Settings (R5) — pixel-perfect copy of /mockups/talent/settings.
   All styling lives here so the view carries zero inline CSS. ── */
.ts-main{display:flex;max-width:960px;margin:0 auto;padding:24px 0;gap:24px;}

/* Sidebar */
.ts-sidebar{width:200px;flex-shrink:0;}
.ts-sb-title{font-family:'Geist',system-ui,sans-serif;font-size:18px;font-weight:700;margin-bottom:14px;}
.ts-sb-nav{display:flex;flex-direction:column;gap:2px;}
.ts-sb-item{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:8px;font-size:11px;font-weight:600;color:#888;cursor:pointer;transition:all .15s;border:none;background:none;font-family:inherit;text-align:left;width:100%;}
.ts-sb-item:hover{color:#B8975A;background:rgba(184,151,90,.03);}
.ts-sb-item.ts-on{color:#B8975A;background:rgba(184,151,90,.06);font-weight:700;}
.ts-sb-item-icon{width:20px;display:flex;align-items:center;justify-content:center;}

/* Content */
.ts-content{flex:1;min-width:0;}

/* Section show/hide + animation */
.ts-section{display:none;animation:tsFadeUp .3s ease both;}
.ts-section.ts-active{display:block;}
@keyframes tsFadeUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* Section title */
.ts-sec-title{font-family:'Geist',system-ui,sans-serif;font-size:20px;font-weight:700;margin-bottom:4px;}
.ts-sec-title em{font-style:italic;color:#B8975A;font-weight:400;}
.ts-sec-sub{font-size:10px;color:#888;margin-bottom:20px;}

/* Card */
.ts-card{
  background:
    radial-gradient(120% 80% at 0% 0%, rgba(255,244,194,0.06) 0%, rgba(255,255,255,0) 55%),
    radial-gradient(120% 80% at 100% 100%, rgba(189,151,51,0.04) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, #FFFFFF 0%, #FBFAF7 60%, #F6F4EE 100%);
  border-radius:14px;border:1px solid rgba(0,0,0,0.05);padding:18px;margin-bottom:14px;
  box-shadow:0 1px 0 rgba(255,255,255,0.9) inset,0 0 0 1px rgba(255,255,255,0.5) inset,0 1px 2px rgba(20,16,8,0.03),0 6px 20px -10px rgba(120,98,40,0.08);
  transition:all .2s;
}
.ts-card:hover{
  box-shadow:0 1px 0 rgba(255,255,255,0.9) inset,0 0 0 1px rgba(255,255,255,0.6) inset,0 2px 4px rgba(20,16,8,0.04),0 14px 32px -14px rgba(120,98,40,0.14);
}
.ts-card-title{font-size:11px;font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:6px;}
.ts-card-title-icon{color:#A8893C;display:flex;align-items:center;}

/* Future-brick (grayed) cards + rows */
.ts-soon{opacity:.55;}
.ts-soon-badge{display:inline-flex;align-items:center;margin-left:6px;padding:2px 7px;border-radius:999px;font-size:7px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:#A8893C;background:rgba(184,151,90,.1);border:1px solid rgba(184,151,90,.2);}

/* Form rows */
.ts-form-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(0,0,0,.03);}
.ts-form-row:last-child{border-bottom:none;}
.ts-fr-left{flex:1;}
.ts-fr-label{font-size:11px;font-weight:600;color:#1a1a1a;}
.ts-fr-desc{font-size:9px;color:#999;margin-top:1px;}

/* Form grid */
.ts-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.ts-field-label{font-size:8px;font-weight:700;color:#999;text-transform:uppercase;letter-spacing:.3px;display:block;margin-bottom:3px;}

/* Toggle switch (checkbox-driven, no JS needed for visual state) */
.ts-toggle{width:38px;height:20px;border-radius:10px;background:rgba(0,0,0,.08);position:relative;cursor:pointer;transition:background .2s;flex-shrink:0;display:inline-block;}
.ts-toggle.ts-toggle-on{background:#B8975A;}
.ts-toggle::after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:transform .2s;}
.ts-toggle.ts-toggle-on::after{transform:translateX(18px);}

/* Checkbox-backed toggle: hidden input drives the visual pill via :checked. */
.ts-switch{position:relative;display:inline-block;width:38px;height:20px;flex-shrink:0;cursor:pointer;}
.ts-switch input{position:absolute;opacity:0;width:0;height:0;margin:0;}
.ts-switch-pill{position:absolute;inset:0;border-radius:10px;background:rgba(0,0,0,.08);transition:background .2s;}
.ts-switch-pill::after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:transform .2s;}
.ts-switch input:checked + .ts-switch-pill{background:#B8975A;}
.ts-switch input:checked + .ts-switch-pill::after{transform:translateX(18px);}
.ts-switch input:focus-visible + .ts-switch-pill{outline:2px solid #C9A96E;outline-offset:2px;}

/* Input */
.ts-fi{width:100%;padding:8px 12px;border-radius:7px;border:1.5px solid rgba(0,0,0,.06);font-size:11px;outline:none;transition:border .15s;font-family:'Geist',sans-serif;}
.ts-fi:focus{border-color:#C9A96E;}

/* Select */
.ts-sel{width:100%;padding:8px 12px;border-radius:7px;border:1.5px solid rgba(0,0,0,.06);font-size:11px;outline:none;appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 8px center/12px no-repeat;padding-right:28px;font-family:'Geist',sans-serif;}

/* Notification grid */
.ts-notif-grid{display:grid;grid-template-columns:1fr 50px 50px 50px;gap:0;align-items:center;}
.ts-notif-header{margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid rgba(0,0,0,.04);}
.ts-notif-col-label{text-align:center;font-size:7px;font-weight:700;color:#bbb;text-transform:uppercase;letter-spacing:.3px;}
.ts-notif-rows{gap:6px 0;}
.ts-notif-toggle-cell{text-align:center;}
.ts-notif-toggle-cell .ts-switch{margin:0 auto;display:inline-block;}

/* Danger zone */
.ts-danger{padding:14px;border-radius:14px;border:1.5px solid rgba(192,57,43,.1);background:rgba(192,57,43,.02);}
.ts-danger-title{font-size:10px;font-weight:700;color:#C0392B;margin-bottom:4px;}
.ts-danger-desc{font-size:9px;color:#888;margin-bottom:8px;}
.ts-danger-actions{display:flex;gap:8px;}
.ts-danger-btn{padding:7px 14px;border-radius:7px;font-size:9px;font-weight:700;border:1.5px solid rgba(192,57,43,.15);color:#C0392B;transition:all .15s;cursor:pointer;background:none;font-family:inherit;}
.ts-danger-btn:hover{background:rgba(192,57,43,.05);}

/* Save bar */
.ts-save-bar{padding:14px 0;display:flex;justify-content:flex-end;gap:8px;}
.ts-btn-save{padding:10px 20px;border-radius:8px;font-size:11px;font-weight:700;background:linear-gradient(135deg,#C4A559 0%,#D4BC7A 40%,#E5D4A0 70%,#EFE2B8 100%);color:#fff;box-shadow:0 3px 12px rgba(150,120,62,.18);text-shadow:0 1px 1px rgba(0,0,0,.08);transition:all .15s;cursor:pointer;border:none;font-family:inherit;}
.ts-btn-save:hover{transform:translateY(-1px);}
.ts-btn-save:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
.ts-btn-save:disabled:hover{transform:none;}
.ts-btn-cancel{padding:10px 20px;border-radius:8px;font-size:11px;font-weight:700;border:1.5px solid rgba(0,0,0,.06);color:#888;cursor:pointer;background:none;font-family:inherit;text-decoration:none;display:inline-flex;align-items:center;}

/* Action buttons (inline) */
.ts-action-gold{font-size:10px;font-weight:700;color:#B8975A;border:none;background:none;cursor:pointer;font-family:inherit;padding:0;}
.ts-action-muted{font-size:10px;font-weight:700;color:#888;border:none;background:none;cursor:pointer;font-family:inherit;padding:0;}

/* Inline password change form (revealed inside Sécurité card) */
.ts-pw-form{display:none;margin-top:10px;padding-top:12px;border-top:1px solid rgba(0,0,0,.04);}
.ts-pw-form.ts-pw-open{display:block;}
.ts-pw-grid{display:grid;grid-template-columns:1fr;gap:10px;}

/* Responsive */
@media(max-width:768px){
  .ts-main{flex-direction:column;}
  .ts-sidebar{width:100%;}
  .ts-sb-nav{flex-direction:row;overflow-x:auto;gap:4px;}
  .ts-form-grid{grid-template-columns:1fr;}
}