/* Sassi family - the two lines about messages on the screen that creates an account (shared/php/signup_lines.php, owner
   2026-09-28): boxes as on the family's join form. The first is ticked and locked (what is always sent), the second is the
   person's own choice, and both look the same when ticked. The input stays in the page for the keyboard and for a screen reader; the box beside it is what is seen. */
.sgl{display:flex;flex-direction:column;gap:10px;text-align:right}
.sgl-line{display:flex;align-items:flex-start;gap:10px;cursor:pointer;font-size:13px;line-height:1.6;color:var(--dim);position:relative}
.sgl-line input{position:absolute;inset-inline-start:0;top:2px;width:22px;height:22px;margin:0;opacity:0;cursor:pointer}
.sgl-line .box{width:22px;height:22px;border-radius:7px;border:1.5px solid var(--border);flex:none;margin-top:1px;position:relative;transition:background .15s,border-color .15s}
.sgl-line .box::after{content:"";position:absolute;left:7px;top:3px;width:5px;height:10px;border:solid var(--ink,#0f1311);border-width:0 2px 2px 0;transform:rotate(45deg);opacity:0}
.sgl-line input:checked+.box{background:var(--ac);border-color:var(--ac)}
.sgl-line input:checked+.box::after{opacity:1}
.sgl-line input:focus-visible+.box{outline:2px solid var(--ac);outline-offset:2px}
.sgl-line .t{flex:1 1 auto;min-width:0}
/* locked: said, not asked. It LOOKS active, the same as a box the person ticked (owner 2026-09-28: grey read as switched
   off); only the pointer tells that it does not change */
.sgl-line.locked{cursor:default}
.sgl-line.locked input{cursor:default}