/* Suite de calculateurs de trading.
   Feuille autonome sous .sdt-calc : elle ne dépend pas du socle .sdt-outil
   et ne peut donc pas entrer en conflit avec lui.
   Direction Signal : base claire, noir franc, vert / jaune / rouge à sens,
   filets 2px, ombres dures, Archivo + JetBrains Mono. */

.sdt-calc{
  --c-ink:#101010;
  --c-paper:#ffffff;
  --c-shell:#f2f1ec;
  --c-green:#0a8f4f;
  --c-green-soft:#e3f5eb;
  --c-yellow:#ffd400;
  --c-red:#d2291a;
  --c-red-soft:#fbe6e3;
  --c-mute:#6b6b64;
  --c-sans:"Archivo","Archivo Variable",system-ui,-apple-system,"Segoe UI",sans-serif;
  --c-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  font-family:var(--c-sans,"Archivo",system-ui,sans-serif);
  color:var(--c-ink,#101010);
  background-color:var(--c-paper,#ffffff);
  border:2px solid var(--c-ink,#101010);
  box-shadow:5px 5px 0 var(--c-ink,#101010);
  margin:2rem 0;
  max-width:100%;
}
.sdt-calc *,.sdt-calc *::before,.sdt-calc *::after{box-sizing:border-box;}
.sdt-calc p,.sdt-calc ul,.sdt-calc li,.sdt-calc dl,.sdt-calc dt,.sdt-calc dd{margin:0;padding:0;}
.sdt-calc ul,.sdt-calc li{list-style:none;}
.sdt-calc [hidden]{display:none !important;}

/* en-tete */
.sdt-calc__head{padding:1rem 1.1rem;border-bottom:2px solid var(--c-ink,#101010);background-color:var(--c-yellow,#ffd400);}
p.sdt-calc__title{font-size:1.15rem;font-weight:700;line-height:1.2;letter-spacing:-.015em;}
p.sdt-calc__sub{margin-top:.4rem;font-size:.78rem;line-height:1.5;max-width:60ch;}

/* contexte partage */
.sdt-calc__ctx{
  margin:0;border:0;border-bottom:2px solid var(--c-ink,#101010);
  padding:1.1rem;background-color:var(--c-shell,#f2f1ec);
}
.sdt-calc__legend{
  padding:0 0 .7rem;font-family:var(--c-mono,monospace);
  font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink,#101010);
}
.sdt-calc__grid{display:grid;grid-template-columns:1fr;gap:.85rem;}
.sdt-calc__row{display:grid;grid-template-columns:1fr;gap:.85rem;}

/* champs */
.sdt-calc__field{display:flex;flex-direction:column;gap:.3rem;min-width:0;}
.sdt-calc__field > span:first-child{font-size:.76rem;font-weight:600;line-height:1.3;}
.sdt-calc__field--wide{grid-column:1 / -1;}
.sdt-calc input[type="text"],.sdt-calc select{
  font-family:var(--c-mono,monospace);font-size:.9rem;line-height:1.3;width:100%;min-width:0;
  color:var(--c-ink,#101010);background-color:var(--c-paper,#ffffff);
  border:2px solid var(--c-ink,#101010);border-radius:0;padding:.5rem .6rem;
  -webkit-appearance:none;-moz-appearance:none;appearance:none;
}
.sdt-calc select{
  font-family:var(--c-sans,sans-serif);font-weight:600;padding-right:2rem;
  background-image:linear-gradient(45deg,transparent 50%,#101010 50%),linear-gradient(135deg,#101010 50%,transparent 50%);
  background-position:calc(100% - 16px) 55%,calc(100% - 11px) 55%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
.sdt-calc input[type="text"]:focus,.sdt-calc select:focus,
.sdt-calc button:focus-visible,.sdt-calc input[type="checkbox"]:focus-visible{
  outline:3px solid var(--c-ink,#101010);outline-offset:2px;
}
.sdt-calc__in{display:flex;align-items:stretch;}
.sdt-calc__in input[type="text"]{border-right:0;}
.sdt-calc__in b{
  display:flex;align-items:center;padding:0 .65rem;font-weight:400;
  font-family:var(--c-mono,monospace);font-size:.78rem;
  border:2px solid var(--c-ink,#101010);background-color:var(--c-shell,#f2f1ec);
}
.sdt-calc__check{display:flex;gap:.55rem;align-items:flex-start;font-size:.76rem;line-height:1.4;cursor:pointer;}
.sdt-calc__check input{margin:.15rem 0 0;flex:0 0 auto;accent-color:#101010;}
p.sdt-calc__hint{font-size:.7rem;line-height:1.45;color:var(--c-mute,#6b6b64);}

/* puces de specification */
ul.sdt-calc__chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.85rem;}
ul.sdt-calc__chips li{
  font-family:var(--c-mono,monospace);font-size:.66rem;line-height:1.2;padding:.3rem .5rem;
  border:2px solid var(--c-ink,#101010);background-color:var(--c-paper,#ffffff);
}
ul.sdt-calc__chips li b{font-weight:700;}

/* onglets */
.sdt-calc__tabs{
  display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;
  border-bottom:2px solid var(--c-ink,#101010);background-color:var(--c-ink,#101010);gap:2px;
}
.sdt-calc__tab{
  flex:0 0 auto;cursor:pointer;white-space:nowrap;border:0;border-radius:0;
  font-family:var(--c-sans,sans-serif);font-size:.76rem;font-weight:600;
  padding:.7rem .85rem;background-color:var(--c-ink,#101010);color:#ffffff;
}
.sdt-calc__tab:hover{background-color:#2c2c2c;}
.sdt-calc__tab[aria-selected="true"]{background-color:var(--c-yellow,#ffd400);color:var(--c-ink,#101010);}

/* panneaux */
.sdt-calc__panel{display:grid;grid-template-columns:1fr;}
.sdt-calc__panel > *{min-width:0;}
.sdt-calc__form{padding:1.1rem;display:flex;flex-direction:column;gap:.85rem;background-color:var(--c-shell,#f2f1ec);}
.sdt-calc__result{padding:1.1rem;border-top:2px solid var(--c-ink,#101010);}

.sdt-calc__relink{
  align-self:flex-start;cursor:pointer;border-radius:0;
  font-family:var(--c-mono,monospace);font-size:.66rem;line-height:1.3;text-align:left;
  padding:.4rem .6rem;border:2px solid var(--c-ink,#101010);
  background-color:var(--c-yellow,#ffd400);color:var(--c-ink,#101010);
}
.sdt-calc__quick{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;}
.sdt-calc__qb{
  cursor:pointer;border-radius:0;font-family:var(--c-mono,monospace);font-size:.68rem;
  padding:.3rem .5rem;border:2px solid var(--c-ink,#101010);
  background-color:var(--c-paper,#ffffff);color:var(--c-ink,#101010);
}
.sdt-calc__qb:hover,.sdt-calc__qb[aria-pressed="true"]{background-color:var(--c-ink,#101010);color:#ffffff;}

/* resultats */
p.sdt-calc__rlabel{
  font-family:var(--c-mono,monospace);font-size:.66rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--c-mute,#6b6b64);
}
p.sdt-calc__big{
  font-family:var(--c-mono,monospace);font-size:2.1rem;font-weight:700;line-height:1.05;
  letter-spacing:-.03em;margin-top:.25rem;min-height:2.2rem;word-break:break-word;
}
p.sdt-calc__big small{font-size:.85rem;font-weight:400;letter-spacing:0;color:var(--c-mute,#6b6b64);}
p.sdt-calc__big.is-pos{color:var(--c-green,#0a8f4f);}
p.sdt-calc__big.is-neg{color:var(--c-red,#d2291a);}

dl.sdt-calc__rows{margin-top:.9rem;border-top:2px solid var(--c-ink,#101010);}
dl.sdt-calc__rows > div{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.15rem .8rem;
  padding:.45rem 0;border-bottom:1px solid #d9d8d1;
}
dl.sdt-calc__rows dt{font-size:.72rem;line-height:1.35;color:var(--c-mute,#6b6b64);flex:1 1 auto;min-width:0;}
dl.sdt-calc__rows dd{
  font-family:var(--c-mono,monospace);font-size:.82rem;font-weight:700;
  text-align:right;white-space:nowrap;margin-left:auto;max-width:100%;
}
dl.sdt-calc__rows dd.is-pos{color:var(--c-green,#0a8f4f);}
dl.sdt-calc__rows dd.is-neg{color:var(--c-red,#d2291a);}

p.sdt-calc__formula{
  margin-top:.9rem;padding:.6rem .7rem;font-family:var(--c-mono,monospace);
  font-size:.7rem;line-height:1.6;overflow-x:auto;white-space:nowrap;
  background-color:var(--c-ink,#101010);color:#ffffff;
}
p.sdt-calc__formula b{color:var(--c-yellow,#ffd400);font-weight:400;}
p.sdt-calc__flag{
  margin-top:.7rem;padding:.6rem .7rem;font-size:.74rem;line-height:1.45;
  border:2px solid var(--c-ink,#101010);background-color:var(--c-red-soft,#fbe6e3);
}
p.sdt-calc__flag.is-note{background-color:var(--c-shell,#f2f1ec);}
p.sdt-calc__flag.is-ok{background-color:var(--c-green-soft,#e3f5eb);}

/* pied */
.sdt-calc__foot{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem;
  padding:.85rem 1.1rem;border-top:2px solid var(--c-ink,#101010);
}
.sdt-calc__foot p{font-size:.7rem;line-height:1.45;color:var(--c-mute,#6b6b64);max-width:52ch;}
.sdt-calc__reset{
  flex:0 0 auto;cursor:pointer;border-radius:0;
  font-family:var(--c-mono,monospace);font-size:.68rem;letter-spacing:.05em;text-transform:uppercase;
  padding:.45rem .8rem;border:2px solid var(--c-ink,#101010);
  background-color:transparent;color:var(--c-ink,#101010);
}
.sdt-calc__reset:hover{background-color:var(--c-ink,#101010);color:#ffffff;}

@media (min-width:560px){
  .sdt-calc__grid{grid-template-columns:1fr 1fr;gap:.9rem 1rem;}
  .sdt-calc__row{grid-template-columns:1fr 1fr;gap:.9rem 1rem;}
}
@media (min-width:880px){
  .sdt-calc__tabs{flex-wrap:wrap;overflow-x:visible;}
  .sdt-calc__panel{grid-template-columns:1fr 1fr;}
  .sdt-calc__form{align-content:start;}
  .sdt-calc__result{border-top:0;border-left:2px solid var(--c-ink,#101010);}
  p.sdt-calc__big{font-size:2.4rem;min-height:2.5rem;}
}
