/* ============================================================
   D&A NEXUS — PORTAL CLIENT THEME PER PROJECT
   PORTAL_CLIENT_THEME_PER_PROJECT_V1
   ============================================================ */

#client-portal-suite.portal-client-theme {
  background:
    var(--portal-client-theme-bg)
    !important;

  color:
    var(--portal-client-theme-text)
    !important;
}


/* CARTES / SURFACES */

#client-portal-suite.portal-client-theme .spotlight-card,
#client-portal-suite.portal-client-theme [class*="portal-"][class*="-card"],
#client-portal-suite.portal-client-theme .portal-delivery-section,
#client-portal-suite.portal-client-theme .portal-workflow-phase,
#client-portal-suite.portal-client-theme .portal-message-bubble,
#client-portal-suite.portal-client-theme .portal-chat-panel,
#client-portal-suite.portal-client-theme .portal-chat-inbox {

  background:
    var(--portal-client-theme-surface)
    !important;

  border-color:
    var(--portal-client-theme-border)
    !important;

  color:
    var(--portal-client-theme-text)
    !important;
}


/* TEXTES */

#client-portal-suite.portal-client-theme h1,
#client-portal-suite.portal-client-theme h2,
#client-portal-suite.portal-client-theme h3,
#client-portal-suite.portal-client-theme h4,
#client-portal-suite.portal-client-theme h5,
#client-portal-suite.portal-client-theme strong,
#client-portal-suite.portal-client-theme .portal-doc-title {

  color:
    var(--portal-client-theme-text)
    !important;
}


#client-portal-suite.portal-client-theme p,
#client-portal-suite.portal-client-theme small,
#client-portal-suite.portal-client-theme label,
#client-portal-suite.portal-client-theme th,
#client-portal-suite.portal-client-theme td {

  border-color:
    var(--portal-client-theme-border)
    !important;
}


/* INPUTS */

#client-portal-suite.portal-client-theme input,
#client-portal-suite.portal-client-theme textarea,
#client-portal-suite.portal-client-theme select {

  background:
    var(--portal-client-theme-surface)
    !important;

  color:
    var(--portal-client-theme-text)
    !important;

  border-color:
    var(--portal-client-theme-border)
    !important;
}


#client-portal-suite.portal-client-theme input::placeholder,
#client-portal-suite.portal-client-theme textarea::placeholder {

  color:
    var(--portal-client-theme-muted)
    !important;
}


/* ACCENTS */

#client-portal-suite.portal-client-theme a,
#client-portal-suite.portal-client-theme .text-link-action {

  color:
    var(--portal-client-theme-accent)
    !important;
}


#client-portal-suite.portal-client-theme .portal-mode-btn.active,
#client-portal-suite.portal-client-theme .btn-glow-primary,
#client-portal-suite.portal-client-theme .portal-visibility-chip.client {

  background:
    var(--portal-client-theme-primary)
    !important;

  color:
    #ffffff
    !important;

  border-color:
    var(--portal-client-theme-primary)
    !important;
}


#client-portal-suite.portal-client-theme #portal-delivery-progress,
#client-portal-suite.portal-client-theme .portal-progress-fill,
#client-portal-suite.portal-client-theme .portal-workflow-progress > i {

  background:
    var(--portal-client-theme-accent)
    !important;
}


/* HERO — toujours lisible */

#client-portal-suite #portal-cover-hero,
#client-portal-suite #portal-cover-hero * {

  color:
    #ffffff
    !important;
}


/* ============================================================
   DESIGNER THEME TOOL
   ============================================================ */

.portal-theme-designer {

  position:
    fixed;

  top:
    86px;

  right:
    26px;

  z-index:
    9995;

  width:
    360px;

  max-width:
    calc(100vw - 32px);

  pointer-events:
    none;

  font-family:
    Inter,
    Arial,
    sans-serif;
}


.portal-theme-launcher {

  pointer-events:
    auto;

  margin-left:
    auto;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    7px;

  padding:
    10px 14px;

  border:
    1px solid rgba(20,20,20,.10);

  border-radius:
    999px;

  background:
    rgba(255,255,255,.94);

  color:
    #211d1b;

  font-size:
    11px;

  font-weight:
    700;

  box-shadow:
    0 10px 32px rgba(20,20,20,.12);

  backdrop-filter:
    blur(18px);

  cursor:
    pointer;
}


.portal-theme-launcher:hover {

  transform:
    translateY(-1px);
}


.portal-theme-panel {

  pointer-events:
    auto;

  margin-top:
    9px;

  padding:
    16px;

  border:
    1px solid rgba(20,20,20,.10);

  border-radius:
    18px;

  background:
    rgba(255,255,255,.98);

  box-shadow:
    0 24px 70px rgba(20,20,20,.18);

  color:
    #211d1b;

  max-height:
    calc(100vh - 150px);

  overflow-y:
    auto;
}


.portal-theme-panel-head {

  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    14px;

  margin-bottom:
    14px;
}


.portal-theme-panel-head > div {

  display:
    flex;

  flex-direction:
    column;

  gap:
    2px;
}


.portal-theme-panel-head span {

  font-size:
    8px;

  letter-spacing:
    .14em;

  font-weight:
    800;

  color:
    #8c8581;
}


.portal-theme-panel-head strong {

  font-size:
    13px;

  color:
    #211d1b
    !important;
}


.portal-theme-panel-head button {

  width:
    30px;

  height:
    30px;

  display:
    grid;

  place-items:
    center;

  border:
    0;

  border-radius:
    9px;

  background:
    #f4f2f0;

  cursor:
    pointer;
}


.portal-theme-presets {

  display:
    grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:
    8px;
}


.portal-theme-preset {

  display:
    flex;

  align-items:
    center;

  gap:
    9px;

  min-width:
    0;

  padding:
    9px;

  border:
    1px solid #e7e2de;

  border-radius:
    12px;

  background:
    #ffffff;

  cursor:
    pointer;

  text-align:
    left;
}


.portal-theme-preset.active {

  border-color:
    #8a4b56;

  box-shadow:
    0 0 0 2px
    rgba(138,75,86,.10);
}


.portal-theme-swatches {

  width:
    42px;

  height:
    30px;

  display:
    flex;

  overflow:
    hidden;

  flex:
    0 0 auto;

  border-radius:
    8px;

  border:
    1px solid rgba(0,0,0,.07);
}


.portal-theme-swatches i {

  flex:
    1;
}


.portal-theme-preset > span:last-child {

  min-width:
    0;

  display:
    flex;

  flex-direction:
    column;

  gap:
    1px;
}


.portal-theme-preset b {

  font-size:
    10px;

  color:
    #211d1b
    !important;
}


.portal-theme-preset small {

  font-size:
    8px;

  color:
    #88817c
    !important;

  white-space:
    nowrap;
}


.portal-theme-custom-fields {

  margin-top:
    13px;

  padding:
    12px;

  display:
    grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:
    9px;

  border-radius:
    13px;

  background:
    #f7f5f3;
}


.portal-theme-custom-title {

  grid-column:
    1 / -1;

  font-size:
    9px;

  font-weight:
    800;

  text-transform:
    uppercase;

  letter-spacing:
    .08em;

  color:
    #766d68;
}


.portal-theme-custom-fields label {

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    8px;

  padding:
    7px 8px;

  border:
    1px solid #e5ded9;

  border-radius:
    10px;

  background:
    white;

  color:
    #38312d
    !important;

  font-size:
    9px;
}


.portal-theme-custom-fields input[type="color"] {

  width:
    30px
    !important;

  height:
    25px
    !important;

  padding:
    0
    !important;

  border:
    0
    !important;

  background:
    transparent
    !important;

  cursor:
    pointer;
}


.portal-theme-panel-actions {

  display:
    flex;

  justify-content:
    space-between;

  align-items:
    center;

  gap:
    10px;

  margin-top:
    14px;
}


.portal-theme-panel-actions > div {

  display:
    flex;

  gap:
    7px;
}


.portal-theme-reset,
.portal-theme-cancel,
.portal-theme-save {

  height:
    32px;

  padding:
    0 11px;

  border-radius:
    9px;

  font-size:
    9px;

  font-weight:
    700;

  cursor:
    pointer;
}


.portal-theme-reset,
.portal-theme-cancel {

  border:
    1px solid #dfdad6;

  background:
    #ffffff;

  color:
    #4e4642;
}


.portal-theme-save {

  display:
    inline-flex;

  align-items:
    center;

  gap:
    5px;

  border:
    1px solid #5d2638;

  background:
    #5d2638;

  color:
    #ffffff;
}


.nexus-client-session
.portal-theme-designer {

  display:
    none
    !important;
}


@media (max-width:700px) {

  .portal-theme-designer {

    top:
      72px;

    right:
      12px;

    width:
      calc(100vw - 24px);
  }

}