/* TotalScreen theme 2.77.0 - the usage-records card and Settings -> Usage records (handoff 22 §3). Tokens only, so light /
   dark / system / sunlight follow the theme (INV-5); the sheet is the kit's TS.ui.sheet, the row the shell's
   .settings-row, the buttons the kit's .ts-btn, the draft mark a --sys-tint pair (INV-6). */

.ts-consent-section[hidden]{display:none}

/* the card */
.ts-consent-card{display:flex;flex-direction:column;gap:var(--ref-space-3,12px);color:var(--sys-text);
  font-size:var(--ref-font-md,16px);line-height:1.5}
.ts-consent-card p{margin:0;overflow-wrap:anywhere}
.ts-consent-words{padding:var(--ref-space-3,12px) var(--ref-space-4,16px);border:1px solid var(--sys-border);
  border-radius:var(--ref-radius-md,12px);background:var(--sys-surface)}
.ts-consent-words p{margin:0 0 var(--ref-space-2,8px)}
.ts-consent-words p:last-child{margin-bottom:0}
/* 2.77.2: "In short" on top, a tint pair (INV-6), then "The full notice" with a heading over each paragraph */
.ts-consent-short{padding:var(--ref-space-3,12px) var(--ref-space-4,16px);border-radius:var(--ref-radius-md,12px);
  background:var(--sys-tint-info-bg);color:var(--sys-tint-info-fg)}
.ts-consent-h3{margin:0 0 var(--ref-space-2,8px);font-size:var(--ref-font-sm,15px);font-weight:var(--sys-font-wt-b,700);
  color:inherit;letter-spacing:.01em}
.ts-consent-full .ts-consent-h3{color:var(--sys-text)}
.ts-consent-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ref-space-2,8px)}
.ts-consent-li{display:flex;gap:var(--ref-space-2,8px);align-items:flex-start;font-weight:var(--sys-font-wt-md,500);line-height:1.4}
.ts-consent-li span{min-width:0;overflow-wrap:anywhere}
.ts-consent-ico{flex:0 0 auto;width:20px;height:20px;margin-top:1px}
.ts-consent-h4{margin:0 0 var(--ref-space-1,4px);font-size:var(--ref-font-sm,15px);font-weight:var(--sys-font-wt-b,700);color:var(--sys-text)}
.ts-consent-words p+.ts-consent-h4{margin-top:var(--ref-space-3,12px)}
.ts-consent-more{color:var(--sys-text-sec);font-size:var(--ref-font-sm,15px)}
.ts-consent-draft{align-self:flex-start;display:inline-flex;align-items:center;padding:var(--ref-space-1,4px) var(--ref-space-3,12px);
  border-radius:var(--ref-radius-full,999px);font-size:var(--ref-font-xs,13px);font-weight:var(--sys-font-wt-md,500);
  background:var(--sys-tint-warning-bg);color:var(--sys-tint-warning-fg)}

/* Settings -> Usage records */
.ts-consent-row{gap:var(--ref-space-3,12px);align-items:center;flex-wrap:wrap}
.ts-consent-row .sr-left{min-width:0;flex:1 1 12em;align-items:flex-start}
.ts-consent-row .sr-right{flex:0 0 auto}
.ts-consent-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.ts-consent-sub{font-size:var(--ref-font-xs,13px);color:var(--sys-text-sec);line-height:1.35;overflow-wrap:anywhere}
.ts-consent-row .ts-btn{min-height:44px;white-space:nowrap}
.ts-consent-status{margin:0 0 var(--ref-space-2,8px);font-size:var(--ref-font-sm,15px);color:var(--sys-text-sec)}
.ts-consent-status:empty{margin:0}
.ts-consent-status.is-error{color:var(--sys-error,var(--sys-text))}