/* Shared surface lifecycle. Application CSS owns placement, not motion. */
:root {
  --ui-panel-duration:620ms;
  --ui-subview-duration:260ms;
  --ui-dialog-duration:180ms;
  --ui-panel-easing:cubic-bezier(0.2,0.85,0.22,1);
  --ui-feedback-success-duration:4000ms;
  --ui-feedback-fade-duration:200ms;
  --ui-empty-text-size:12px;
  --ui-empty-text-weight:400;
  --ui-empty-text-color:#636963;
  --ui-empty-line-height:18px;
  --ui-empty-min-height:25px;
}
/* Legacy empty-list aliases share the same surface as both applications. */
:is(.system-standard-empty-state,.empty,.empty-state,.notification-empty,.reporting-empty-state),
#employeeRailThirdPanel .system-standard-empty-state {
  box-sizing:border-box; min-width:0; min-height:var(--ui-empty-min-height);
  margin:0; padding:3.5px 0; border:0; border-radius:0;
  background:transparent; box-shadow:none;
  font:var(--ui-empty-text-weight) var(--ui-empty-text-size)/var(--ui-empty-line-height) Raleway,sans-serif;
  color:var(--ui-empty-text-color); letter-spacing:normal; text-align:left;
  overflow-wrap:anywhere;
}
.reporting-empty-state { width:100%; }
:is(.system-standard-empty-state,.empty,.empty-state,.notification-empty,.reporting-empty-state)[role="alert"],
#employeeRailThirdPanel .system-standard-empty-state[role="alert"] {
  color:var(--action-negative,#b73535);
}
@media (prefers-reduced-motion:reduce) {
  :root { --ui-panel-duration:0ms; --ui-subview-duration:0ms; --ui-dialog-duration:0ms; --ui-feedback-fade-duration:0ms; }
}
.system-standard-dialog::backdrop,
.system-standard-dialog:not(dialog)::before {
  content:""; position:absolute; inset:0; z-index:0;
  background:rgba(242,242,242,.34);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  animation:ui-dialog-in var(--ui-dialog-duration) ease-out both;
}
.system-standard-dialog.is-closing::backdrop,
.system-standard-dialog.is-closing:not(dialog)::before { animation:ui-dialog-out var(--ui-dialog-duration) ease-out both; }
.system-standard-dialog:not(dialog) { position:fixed; inset:0; z-index:12000; display:flex; align-items:center; justify-content:center; padding:var(--ui-space,25px); }
dialog.system-standard-dialog,
.system-standard-dialog .confirm-card {
  box-sizing:border-box; width:min(var(--ui-dialog-width,650px),calc(100vw - 50px));
  max-height:calc(100dvh - 50px); overflow:auto;
  padding:var(--ui-space,25px); border:0; border-radius:3px;
  background:#fff; color:#000000;
  box-shadow:5px 5px 5px rgba(0,0,0,.5);
  display:grid; gap:var(--ui-space,25px); overflow-wrap:anywhere;
  position:relative; z-index:1;
  animation:ui-dialog-in var(--ui-dialog-duration) ease-out both;
}
dialog.system-standard-dialog.is-closing,
.system-standard-dialog.is-closing .confirm-card { animation:ui-dialog-out var(--ui-dialog-duration) ease-out both; }
.system-standard-dialog.hidden { display:none !important; }
.system-standard-dialog .hidden { display:none !important; }
.system-standard-dialog :is(.confirm-title,.confirm-message) { margin:0; font:400 12px/1.45 Raleway,sans-serif; color:#000000; }
.system-standard-dialog .confirm-title { font-weight:600; }
.system-standard-dialog .confirm-message:empty { display:none; }
.system-standard-dialog .confirm-details { display:grid; gap:var(--ui-space,25px); min-width:0; }
.system-standard-dialog .confirm-detail-row { display:grid; min-width:0; }
.system-standard-dialog :is(.confirm-detail-label,.confirm-detail-value) { font:400 12px/1.45 Raleway,sans-serif; overflow-wrap:anywhere; min-width:0; }
.system-standard-dialog .confirm-detail-label { font-weight:600; }
:is(.system-standard-dialog,.confirm-overlay,.crm-popup-overlay) .confirm-actions,
dialog .actions,
.editor-modal .actions-row {
  display:flex; align-items:center; justify-content:flex-end; flex-wrap:nowrap;
  gap:var(--ui-space,25px); min-height:var(--crm-raised-control-face-height,40px);
  width:100%; margin:0; padding:0;
}
:is(.confirm-overlay,.crm-popup-overlay):not(.system-standard-dialog)>.confirm-card {
  width:min(var(--ui-dialog-width,650px),calc(100vw - 50px));
}
:is(.system-standard-dialog,.confirm-overlay,.crm-popup-overlay) .confirm-actions>button:is([data-dialog-action="cancel"],[aria-label="Annuller"]),
.system-standard-dialog-action-slot:has(>[data-dialog-action="cancel"]) { margin-right:auto; justify-content:flex-start; }
.system-standard-dialog-action-slot { display:flex; align-items:center; justify-content:flex-end; flex:none; width:var(--ui-dialog-action-width); max-width:100%; }
.system-standard-dialog-action-slot[hidden] { display:none !important; }
.system-standard-dialog-action-slot>button { max-width:100% !important; }
/* Unsaved-change decisions share the small expandable, right-aligned action row. */
.system-standard-dialog:is([data-dialog-action-layout="save-close"],[data-dialog-action-layout="compact"]) .confirm-actions {
  min-width:0; min-height:25px; align-items:flex-end; justify-content:flex-end; gap:25px;
}
.system-standard-dialog:is([data-dialog-action-layout="save-close"],[data-dialog-action-layout="compact"]) .system-standard-dialog-action-slot {
  flex:none; width:auto; min-width:25px; margin-right:0; justify-content:flex-end;
}
.system-standard-dialog:is([data-dialog-action-layout="save-close"],[data-dialog-action-layout="compact"]) .confirm-actions>button[data-dialog-action="cancel"] { margin-right:0; }
.confirm-save-choices { display:flex; flex-wrap:wrap; gap:25px; }
.system-standard-dialog:is([data-dialog-action-layout="save-close"],[data-dialog-action-layout="compact"]) .system-standard-action-label {
  max-width:calc(100% - var(--action-label-offset) - var(--action-end-padding));
  overflow:hidden; text-overflow:ellipsis;
}
/* Scope choices stay visible together; cancellation retains the normal Button. */
.system-standard-dialog[data-dialog-action-layout="scope-selection"] { --ui-dialog-width:650px; }
.system-standard-dialog[data-dialog-action-layout="scope-selection"] .confirm-actions {
  justify-content:flex-start; flex-wrap:nowrap;
}
@keyframes ui-dialog-in { from { opacity:0; } to { opacity:1; } }
@keyframes ui-dialog-out { from { opacity:1; } to { opacity:0; } }
.system-standard-feedback { font:400 12px/1.45 Raleway,sans-serif; color:#000000; overflow-wrap:anywhere; }
.system-standard-feedback[data-feedback="error"] { color:var(--action-negative,#b73535); }
.system-standard-feedback[data-feedback="success"] { color:var(--action-positive,#2a922a); }
.system-standard-feedback-banner:not(:empty) { padding:15px var(--ui-space,25px); background:#fff; border-left:3px solid #e1c16e; }
.system-standard-feedback-banner[data-feedback="error"] { border-color:var(--action-negative,#b73535); }
.system-standard-feedback-banner[data-feedback="success"] { border-color:var(--action-positive,#2a922a); }
.system-standard-feedback.is-fading { opacity:0; transition:opacity var(--ui-feedback-fade-duration) ease; }
.system-standard-feedback>button { margin-left:var(--ui-space,25px); }

/* Shared persistent scrollbar: independent of OS overlay/autohide settings.
   The scroll owner retains its content width and uses the existing 25px gutter. */
.system-standard-scroll-fade { --crm-content-scroll-fade-depth:75px; --ui-scrollbar-gutter:var(--ui-space,25px); scrollbar-width:none !important; }
.system-standard-scroll-fade::-webkit-scrollbar { display:none !important; }
@supports selector(::-webkit-scrollbar) {
  .system-standard-scroll-fade { scrollbar-width:auto !important; scrollbar-color:auto !important; }
  .system-standard-scroll-fade::-webkit-scrollbar { display:block !important; width:0 !important; height:8px !important; }
  .system-standard-scroll-fade::-webkit-scrollbar-thumb { background:#a6aaa6; border-radius:3px; }
}
.system-standard-scroll-fade.has-scroll-overflow[data-scrollbar-gutter="extend"] {
  box-sizing:border-box; width:calc(100% + var(--ui-scrollbar-gutter)) !important;
  max-width:none; margin-right:calc(-1 * var(--ui-scrollbar-gutter)); padding-right:var(--ui-scrollbar-gutter) !important;
}
.system-standard-scroll-fade.has-scroll-overflow[data-scrollbar-gutter="inside"] { padding-right:var(--ui-scrollbar-gutter)!important; }
.system-standard-scrollbar { position:fixed; z-index:2147483000; width:5px; border:0; border-radius:3px; background:#a6aaa622; touch-action:none; cursor:pointer; }
.system-standard-scrollbar[hidden] { display:none !important; }
.system-standard-scrollbar-thumb { position:absolute; left:0; top:0; width:5px; min-height:25px; border-radius:3px; background:#a6aaa6; pointer-events:none; }
.system-standard-scrollbar:focus-visible { outline:1px solid #e1c16e; outline-offset:2px; }
.system-standard-scroll-fade.has-scroll-below:not(.has-scroll-above) {
  -webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 75px),rgba(0,0,0,.45) calc(100% - 17px),transparent 100%);
  mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - 75px),rgba(0,0,0,.45) calc(100% - 17px),transparent 100%);
}
.system-standard-scroll-fade.has-scroll-above:not(.has-scroll-below) {
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.45) 17px,#000 75px,#000 100%);
  mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.45) 17px,#000 75px,#000 100%);
}
.system-standard-scroll-fade.has-scroll-above.has-scroll-below {
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.45) 17px,#000 75px,#000 calc(100% - 75px),rgba(0,0,0,.45) calc(100% - 17px),transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.45) 17px,#000 75px,#000 calc(100% - 75px),rgba(0,0,0,.45) calc(100% - 17px),transparent 100%);
}