/* Bilingual SLT accounts. All rules scoped under .bslt-account.
   Palette matches the site: plum #8E2A4B, ink #3A2230, sage #5F6E55. */

/* The page template does not provide a gutter at narrow widths, so the block
   carries its own. box-sizing keeps full-width inputs inside it. */
.bslt-account{
  max-width:34rem;box-sizing:border-box;
  padding:28px 16px 8px;margin:0 auto 8px;
  font-family:"Work Sans",system-ui,-apple-system,sans-serif;color:#3A2230}
.bslt-account *{box-sizing:border-box}
.bslt-account h2{font-family:"Archivo",sans-serif;font-weight:600;font-size:30px;line-height:1.2;margin:0 0 12px}
.bslt-account h3{font-family:"Archivo",sans-serif;font-weight:600;font-size:20px;line-height:1.25;margin:34px 0 10px}
.bslt-account .bslt-lead{font-size:17px;color:#5A4450;margin:0 0 20px}

.bslt-account .bslt-row{display:block;margin:0 0 18px}
.bslt-account label{display:block;font-weight:500;font-size:16px;margin:0 0 6px}
.bslt-account .bslt-hint{display:block;font-size:14px;color:#5F6E55;margin:4px 0 0}
.bslt-account input[type=text],
.bslt-account input[type=email],
.bslt-account input[type=password]{
  width:100%;box-sizing:border-box;font:inherit;font-size:16px;
  padding:11px 12px;border:1px solid #C3A3B0;border-radius:8px;background:#fff;color:#3A2230;
  min-height:44px}
.bslt-account input[readonly]{background:#F7F2F4;color:#5A4450}

.bslt-account .bslt-pw-wrap{position:relative;display:block}
.bslt-account .bslt-pw-toggle{
  position:absolute;top:50%;transform:translateY(-50%);inset-inline-end:6px;
  font:inherit;font-size:14px;font-weight:500;background:transparent;border:0;color:#8E2A4B;
  cursor:pointer;padding:10px;min-height:44px;min-width:56px;border-radius:6px}

.bslt-account .bslt-fieldset{border:0;padding:0;margin:0 0 18px}
.bslt-account .bslt-fieldset legend{font-weight:500;font-size:16px;padding:0;margin:0 0 8px}
.bslt-account .bslt-radio{display:flex;align-items:center;gap:10px;margin:0 0 8px;min-height:44px}
.bslt-account .bslt-radio input{width:20px;height:20px;flex:0 0 auto;margin:0}
.bslt-account .bslt-radio label{margin:0;font-weight:400}

.bslt-account .bslt-consent{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:start}
.bslt-account .bslt-consent input{width:20px;height:20px;margin:2px 0 0}
.bslt-account .bslt-consent label{margin:0;font-weight:400}
.bslt-account .bslt-consent .bslt-hint{grid-column:2}

.bslt-account .bslt-btn{
  font:inherit;font-size:16px;font-weight:500;background:#8E2A4B;color:#fff;border:1px solid #8E2A4B;
  border-radius:999px;padding:12px 26px;min-height:44px;cursor:pointer}
.bslt-account .bslt-btn:hover{background:#7a2340;border-color:#7a2340}
.bslt-account .bslt-btn--quiet{background:#fff;color:#8E2A4B}

.bslt-account a{color:#8E2A4B}

/* Resend confirmation: deliberately minor, a link rather than a call to action. */
.bslt-account .bslt-resend{margin:-14px 0 22px}
.bslt-account .bslt-link-btn{
  font:inherit;font-size:15px;background:none;border:0;padding:8px 0;min-height:44px;
  color:#8E2A4B;text-decoration:underline;cursor:pointer}
.bslt-account .bslt-alt{font-size:15px;margin:10px 0 0}

/* Errors are never signalled by colour alone: each carries a text label. */
.bslt-account .bslt-errors{
  border:2px solid #8E2A4B;border-radius:10px;padding:14px 16px;margin:0 0 22px;background:#FBF3F6}
.bslt-account .bslt-errors p{margin:0 0 8px}
.bslt-account .bslt-errors ul{margin:0;padding-inline-start:1.2em}
.bslt-account .bslt-field-error{display:block;font-size:14px;font-weight:500;color:#8E2A4B;margin:0 0 6px}
.bslt-account .bslt-field-error::before{content:"Error: "}

.bslt-account .bslt-notice{
  border-inline-start:4px solid #7A8B6F;background:#F4F6F1;padding:12px 14px;border-radius:6px;
  font-size:16px;margin:0 0 22px}
.bslt-account .bslt-notice--soft{border-inline-start-color:#D4A544;background:#FBF6EC}

.bslt-account :focus-visible{outline:3px solid #D4A544;outline-offset:2px}

/* Honeypot: hidden from people and assistive tech, present for bots. */
.bslt-account .bslt-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

@media (max-width:520px){
  .bslt-account h2{font-size:26px}
  .bslt-account{padding:20px 16px 8px}
}

/* ------------------------------------------------------------------
   Account page hierarchy — 2026-09-17
   Profile and Security are surfaces; Sign out is a plain secondary
   action between them and the destructive block; Delete is visibly
   set apart. Deliberately still a page, not a dashboard: one column,
   no stat tiles, no chrome.
   ------------------------------------------------------------------ */

.bslt-card {
  background: #FFFDF9;
  border: 1px solid rgba(58, 34, 48, 0.12);
  border-radius: 10px;
  padding: 20px;
  margin: 0 0 20px;
}

.bslt-card__title {
  margin: 0 0 16px;
  font-size: 1.05rem;
  line-height: 1.3;
}

.bslt-card > form > p:last-child {
  margin-bottom: 0;
}

.bslt-signout {
  margin: 0 0 6px;
}

.bslt-signout .bslt-btn {
  width: 100%;
}

/* 2.6.2: account deletion is a small text link under Sign out (a native
   <details>), so Sign out stays the main action. The explanation and the
   request button appear only when the link is opened. */
.bslt-delete {
  margin: 0 0 8px;
  text-align: center;
}

.bslt-delete__toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 4px;
  font-size: 14px;
  color: #6B5560;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  list-style: none;
  border-radius: 6px;
}

.bslt-delete__toggle::-webkit-details-marker {
  display: none;
}

.bslt-delete__toggle::after {
  content: "";
  width: 6px;
  height: 6px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform 0.15s ease;
}

.bslt-delete[open] > .bslt-delete__toggle::after {
  transform: translateY(1px) rotate(-135deg);
}

.bslt-delete__toggle:hover {
  color: #7C2441;
}

.bslt-delete__toggle:focus-visible {
  outline: 2px solid #8E2A4B;
  outline-offset: 2px;
}

.bslt-delete__panel {
  margin: 8px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid rgba(58, 34, 48, 0.18);
  text-align: left;
}

.bslt-account .bslt-delete__title {
  margin: 0 0 6px;
  font-size: 1rem;
  line-height: 1.3;
  color: #7C2441;
}

.bslt-delete .bslt-hint {
  display: block;
  margin: 0 0 14px;
}

.bslt-delete .bslt-form > p:last-child {
  margin-bottom: 0;
}

.bslt-btn--danger {
  background: transparent;
  color: #7C2441;
  border: 1px solid rgba(142, 42, 75, 0.5);
}

.bslt-btn--danger:hover,
.bslt-btn--danger:focus-visible {
  background: #8E2A4B;
  color: #FFFDF9;
  border-color: #8E2A4B;
}

@media (prefers-reduced-motion: reduce) {
  .bslt-delete__toggle::after {
    transition: none;
  }
}

@media (max-width: 600px) {
  .bslt-card {
    padding: 16px;
  }
  .bslt-card .bslt-btn,
  .bslt-delete .bslt-btn {
    width: 100%;
  }
}

.bslt-notice--done h2 {
  margin: 0 0 8px;
  font-size: 1.25rem;
  line-height: 1.25;
}

.bslt-notice--done p {
  margin: 0 0 8px;
}

.bslt-notice--done p:last-child {
  margin-bottom: 0;
}

/* ------------------------------------------------------------------
   My account dashboard — 2026-09-21
   A small resource library, not a dashboard: one column, no stat
   tiles, no sidebar, conditional sections rather than empty tables.
   ------------------------------------------------------------------ */

.bslt-account .bslt-greeting {
  margin: 0 0 4px;
  font-size: 1.15rem;
  font-weight: 600;
}

.bslt-account .bslt-lead {
  margin: 0 0 28px;
  color: #5A4250;
}

.bslt-section {
  margin: 0 0 28px;
}

.bslt-section__title {
  margin: 0 0 12px;
  font-size: 1.1rem;
  line-height: 1.3;
}

.bslt-resource,
.bslt-purchase {
  background: #FFFDF9;
  border: 1px solid rgba(58, 34, 48, 0.12);
  border-radius: 10px;
  padding: 18px;
  margin: 0 0 12px;
}

.bslt-resource__title {
  margin: 0 0 6px;
  font-size: 1rem;
  line-height: 1.3;
}

.bslt-resource__text {
  margin: 0 0 14px;
}

.bslt-resource__cta,
.bslt-download {
  margin: 0;
}

.bslt-purchase__meta {
  margin: 0 0 4px;
  font-size: .9rem;
  color: #5A4250;
}

.bslt-purchase__items {
  margin: 0 0 12px;
  font-weight: 500;
}

.bslt-download {
  margin: 0 0 10px;
}

.bslt-download .bslt-hint {
  display: inline-block;
  margin-left: 8px;
}

.bslt-purchase__link {
  margin: 8px 0 0;
  font-size: .9rem;
}

@media (max-width: 600px) {
  .bslt-resource,
  .bslt-purchase {
    padding: 16px;
  }
  .bslt-resource__cta .bslt-btn,
  .bslt-download .bslt-btn {
    /* Flex, not line-height: a long product name wraps, and a 48px
       line-height would give a two-line button 48px of line spacing. */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    text-align: center;
    line-height: 1.35;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .bslt-download .bslt-hint {
    display: block;
    margin: 6px 0 0;
  }
}
