/* Settings tabs. Layout only: tokens and components come from ic.css. */

/* page frames */
.sg-split{display:grid;grid-template-columns:240px minmax(0,1fr);gap:32px;align-items:start}
.sg-subnav{position:sticky;top:88px;display:flex;flex-direction:column;gap:4px;font-size:14px}
.sg-subnav a{min-height:36px;display:flex;align-items:center;font-weight:600}
.sg-col{display:flex;flex-direction:column;gap:20px;min-width:0}
.sg-narrow{display:flex;flex-direction:column;gap:16px;max-width:980px;min-width:0}
.ic-railgrid.sg-railgrid{gap:28px}
.sg-ink2{color:var(--ic-ink-2)}
.sg-break{overflow-wrap:anywhere}

/* shared pieces */
.sg-fieldset{border:0;padding:0;margin:0;min-width:0;display:flex;flex-direction:column;gap:12px}
.sg-fieldset>legend{padding:0;margin:0 0 2px}
.sg-details{border-top:1px solid var(--ic-line-2);padding-top:10px}
.sg-details>summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--ic-ink-2);padding:6px 0}
.sg-details-body{display:flex;flex-direction:column;gap:12px;padding-top:8px}
.sg-panel{display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:14px;background:var(--ic-surface-2);border:1px solid var(--ic-line-2)}
.sg-fact{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;border-radius:12px;background:var(--ic-surface-2)}
.sg-rows{display:flex;flex-direction:column;gap:14px}
.sg-toggle-row{display:flex;justify-content:space-between;align-items:center;gap:16px}
.sg-divided{padding-top:12px;border-top:1px solid var(--ic-line-2)}
.sg-inline{display:flex;align-items:center;gap:8px;font-size:14px;margin:0}
.sg-inline .ic-select{width:auto}
.sg-manager{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:12px;border:1px dashed var(--ic-field);background:var(--ic-surface-4)}
.sg-manager-card{border-style:dashed;border-color:var(--ic-field);background:var(--ic-surface-4)}
.sg-plain-list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.5}
.sg-code{font-size:13px;background:var(--ic-surface-3);padding:1px 6px;border-radius:6px;overflow-wrap:anywhere}
.sg-inline-card{flex-direction:row;align-items:center;gap:16px;padding:20px 22px}
.sg-box{width:18px;height:18px;margin:0;accent-color:var(--ic-blue);cursor:pointer}

/* switches that post with a plain form (a native checkbox, drawn like .ic-switch) */
.ic-app .sg-switch{appearance:none;-webkit-appearance:none;position:relative;width:50px;height:28px;flex-shrink:0;margin:0;padding:0;border:none;border-radius:99px;background:var(--ic-ink-5);cursor:pointer;transition:background .15s;box-shadow:none}
.ic-app .sg-switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:left .15s}
.ic-app .sg-switch:checked{background:var(--ic-green)}
.ic-app .sg-switch:checked::after{left:25px}
.ic-app .sg-switch.sm{width:46px;height:26px}
.ic-app .sg-switch.sm::after{width:20px;height:20px}
.ic-app .sg-switch.sm:checked::after{left:23px}
.ic-app .sg-switch:disabled{opacity:.5;cursor:not-allowed}

/* mailbox */
.sg-address{overflow-wrap:anywhere}
.sg-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sg-check{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:12px;background:var(--ic-surface-2);border:1px solid var(--ic-line-2);min-width:0}
.sg-check.ok{background:var(--ic-green-tint);border-color:var(--ic-green-line)}
.sg-check.bad{background:var(--ic-red-bg);border-color:var(--ic-red-line)}
.sg-check.warn{background:var(--ic-amber-tint);border-color:var(--ic-amber-line)}
.sg-check.info{background:var(--ic-blue-tint);border-color:var(--ic-blue-line)}
.sg-check-dot{width:28px;height:28px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;color:#fff;background:var(--ic-ink-5)}
.sg-check.ok .sg-check-dot{background:var(--ic-green)}
.sg-check.bad .sg-check-dot{background:var(--ic-red-ink)}
.sg-check.warn .sg-check-dot{background:#B87910}
.sg-check.info .sg-check-dot{background:var(--ic-blue)}
.sg-check-text{display:flex;flex-direction:column;min-width:0}
.sg-check-text b{font-size:15px;font-weight:700}
.sg-check-text span{font-size:13px;color:var(--ic-ink-3)}
.sg-imap{padding-top:4px}
.sg-imap-grid{display:grid;grid-template-columns:minmax(0,1.4fr) 180px minmax(0,1fr);gap:12px}
.sg-checklist>li{padding:12px 16px;align-items:center}
.sg-test{display:flex;align-items:center;gap:16px;padding:14px 16px;border-radius:12px;background:var(--ic-surface-2)}
.sg-postal{min-height:72px}

/* channels */
.sg-channel{display:flex;align-items:center;gap:16px;min-width:0}
.sg-channel-card,.sg-muted-card{padding:20px 22px}
.sg-muted-card{background:var(--ic-surface-4)}
.sg-chan-icon{width:44px;height:44px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.sg-chan-icon.blue{background:var(--ic-blue-bg);color:var(--ic-blue-ink)}
.sg-chan-icon.green{background:#E7F6EF;color:#0E6B45}
.sg-chan-icon.gray{background:var(--ic-line-4);color:var(--ic-ink-2)}
.sg-wa{gap:16px}
.sg-choice{flex-direction:column;align-items:flex-start;gap:6px}
.sg-pair{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:center;padding:18px;border-radius:14px;background:var(--ic-surface-2);border:1px solid var(--ic-line-2)}
.sg-qr{width:220px;height:220px;box-sizing:border-box;padding:16px;border-radius:14px;background:#fff;border:1px solid var(--ic-line);display:flex;align-items:center;justify-content:center;text-align:center;font-size:14px;color:var(--ic-ink-3)}
.sg-qr img{display:block;width:100%;height:100%;object-fit:contain}
.sg-steps{display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.5;min-width:0}
.sg-steps-actions{padding-top:6px}
.sg-guide{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.5}
.sg-linked{display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:14px;background:var(--ic-green-tint);border:1px solid var(--ic-green-line-2)}
.sg-green-body{color:#1F4B34}

/* readiness summary */
.sg-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.sg-stage{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:10px;background:#fff;min-width:0}
.sg-stage small{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--ic-ink-4);text-transform:uppercase}
.sg-stage span{font-size:14px;line-height:1.4}
.sg-ready .sg-stage{background:var(--ic-surface-2);border:1px solid var(--ic-line-2);color:var(--ic-ink)!important;text-decoration:none!important}
.sg-ready .sg-stage:hover{border-color:var(--ic-field)}
.sg-ready .sg-stage.ok{background:var(--ic-green-tint);border-color:var(--ic-green-line)}
.sg-ready .sg-stage span{font-weight:600}
.sg-overview{gap:20px}
.sg-missions{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:1.5}
.sg-missions span{display:block;font-size:13px}
.sg-gaps>li{padding:12px 16px;align-items:center}

/* automation */
.sg-auto{gap:16px}
.sg-auto.on{background:var(--ic-green-tint);border-color:var(--ic-green-line-2)}
.sg-auto.attention{background:var(--ic-amber-tint);border-color:var(--ic-amber-line)}
.sg-auto.off .sg-stage{background:var(--ic-surface-2)}
.sg-auto-toggle{margin:0;flex-shrink:0}
.sg-auto-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--ic-ink-3)}
.sg-run{align-items:center}
.sg-hour{min-width:0;max-width:100%}
.sg-range-head{display:flex;justify-content:space-between;gap:12px;font-size:15px;font-weight:600;margin:0}
.sg-range{width:100%;margin:0;accent-color:var(--ic-blue)}
.sg-fu{flex-wrap:wrap;justify-content:flex-start}
.sg-stat-row{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.sg-safe{background:var(--ic-surface-3);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:6px}
.sg-limits{display:flex;flex-direction:column;gap:10px}
.sg-limits>summary{cursor:pointer;font-size:14px;font-weight:600;min-height:28px}
.sg-limits[open]>summary{margin-bottom:10px}
.sg-limits-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:10px}
.sg-limits .ic-help{margin-bottom:10px}

/* notifications */
.sg-where{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;background:var(--ic-surface-2)}
.sg-where.col{flex-direction:column;align-items:stretch;gap:12px}
.sg-tg-step{display:flex;align-items:center;gap:12px;min-height:44px;margin:0;padding:4px 12px;box-sizing:border-box;border-radius:10px;font-size:14px;background:#fff;border:1px solid var(--ic-line-2);color:var(--ic-ink-3)}
.sg-tg-step.active{border-color:var(--ic-field);color:var(--ic-ink)}
.sg-tg-btn{height:36px;padding:0 12px;border-radius:8px;border:none;background:#229ED9;color:#fff;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap}
.sg-tg-btn:hover{background:#1A8BC2}
.sg-presets{gap:10px}
.sg-presets .sg-choice{gap:4px;padding:14px 16px;border-radius:12px}
.sg-group-label{font-size:12px;font-weight:700;letter-spacing:.05em;color:var(--ic-ink-4);padding:8px 0 4px}
.sg-event{display:flex;align-items:center;gap:14px;min-height:48px;padding:4px 0;border-bottom:1px solid var(--ic-line-3)}
.sg-event label{cursor:pointer}
.sg-when{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:var(--ic-blue-tint);border:1px solid var(--ic-blue-line)}
.sg-when-dot{width:20px;height:20px;border-radius:50%;box-sizing:border-box;flex-shrink:0;margin-top:2px;border:6px solid var(--ic-blue)}
.sg-bubble{padding:14px;border-radius:12px;background:#EAF4FB;font-size:14px;line-height:1.55;color:var(--ic-ink);white-space:pre-wrap;overflow-wrap:anywhere}
.sg-save{display:flex;justify-content:flex-end}
.sg-history>li{padding:12px 16px;align-items:flex-start}
.sg-history summary{cursor:pointer;line-height:1.5}
.sg-history .sg-plain-list{margin-top:10px}

/* countries */
.sg-markets .ic-tr{grid-template-columns:minmax(150px,1.2fr) 70px 110px minmax(220px,2.6fr);padding-top:10px;padding-bottom:10px}
.sg-markets label{cursor:pointer}
.sg-optouts .ic-tr{grid-template-columns:minmax(200px,2fr) minmax(150px,1.2fr) 120px}
.sg-exclusions{min-height:140px}
.sg-kv{border:1px solid var(--ic-line-2);border-radius:12px;overflow:hidden}
.sg-kv .ic-kv{padding:11px 16px;font-size:14px}
.sg-kv .ic-kv:last-child{border-bottom:none}

/* AI assistants */
.sg-tokens .ic-tr{grid-template-columns:minmax(180px,2fr) 130px 110px 130px minmax(170px,auto)}

/* responsive */
@media (max-width:1100px){
  .sg-split{grid-template-columns:minmax(0,1fr);gap:16px}
  .sg-subnav{position:static;flex-direction:row;flex-wrap:wrap;gap:0 16px}
}
@media (max-width:900px){
  .sg-stages{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sg-imap-grid{grid-template-columns:minmax(0,1fr) 160px}
  .sg-imap-grid>:last-child{grid-column:1/-1}
}
@media (max-width:720px){
  .sg-page .ic-card>.ic-row.ic-between{flex-wrap:wrap}
  .sg-checks,.sg-limits-grid,.sg-imap-grid{grid-template-columns:minmax(0,1fr)}
  .sg-imap-grid>:last-child{grid-column:auto}
  .sg-pair{grid-template-columns:minmax(0,1fr);gap:16px}
  .sg-qr{width:100%;max-width:240px;height:auto;aspect-ratio:1}
  .sg-channel{flex-wrap:wrap}
  .sg-channel>.ic-grow{flex-basis:calc(100% - 60px)}
  .sg-inline-card,.sg-test,.sg-fact{flex-direction:column;align-items:flex-start}
  .sg-inline{flex-wrap:wrap}
  .ic-table-scroll>.sg-optouts{min-width:520px}
  .ic-table-scroll>.sg-tokens{min-width:760px}
}
.sg-guide{align-self:flex-start;width:max-content;max-width:100%}

/* Who can we WhatsApp first (WhatsAppFirstContactCard) */
.wa-first{margin-top:10px}
.wa-first-opt{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;align-items:start;border:1px solid var(--ic-line);border-radius:12px;padding:11px 13px;background:var(--ic-surface);cursor:pointer}
.wa-first-opt.on{border-color:var(--ic-blue);background:var(--ic-blue-bg)}
.wa-first-opt input{margin-top:3px;accent-color:var(--ic-blue)}
.wa-first-opt:focus-within{outline:2px solid var(--ic-blue);outline-offset:2px}
.wa-first-default{margin-left:8px;vertical-align:1px}
.wa-first-guard{margin-top:12px;border:1px solid var(--ic-line);border-radius:12px;padding:11px 13px;background:var(--ic-surface-2)}
.wa-first-guard ul{margin:6px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:4px;color:var(--ic-ink-2)}
.wa-first-guard p{margin:8px 0 0}

.mb-provider{display:flex;flex-direction:column;gap:10px;border:1px solid var(--ic-blue-line);background:var(--ic-blue-bg);border-radius:12px;padding:14px 16px}
.mb-provider.guess{border-color:var(--ic-amber-line);background:var(--ic-amber-tint)}
.mb-steps{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;color:var(--ic-ink-2);font-size:14px;line-height:1.5}
.mb-note{color:var(--ic-amber-text)}
.mb-servers{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;word-break:break-all}
.mb-provider .ic-field{max-width:420px}

.fm-script{font-size:14.5px;line-height:1.55;min-height:260px}
.fm-lang{border:1px solid var(--ic-line);background:var(--ic-surface);border-radius:999px;padding:5px 14px;font-size:13.5px;font-weight:600;color:var(--ic-ink-2);cursor:pointer}
.fm-lang.on{border-color:var(--ic-blue);background:var(--ic-blue-bg);color:var(--ic-blue)}
.fm-lang:disabled{opacity:.6;cursor:default}

.fm-lang-more{width:auto;min-width:150px;border-radius:999px;font-size:13.5px}