/* =====================================================================
   SafeQual Portal UI  (Admin, Centre and Learner portals)
   Loaded after safequal-admin.css / safequal-atp.css / safequal-learner.css
   Brand: navy #0f1f3a, gold #c89b2c (from the SafeQual logo)
   Type:  Lora (headings) + Roboto (interface) from /assets/fonts
   ===================================================================== */

@font-face{font-family:"SQ Lora";src:url("../fonts/Lora-Medium.ttf") format("truetype");font-weight:500;font-display:swap}
@font-face{font-family:"SQ Lora";src:url("../fonts/Lora-SemiBold.ttf") format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:"SQ Roboto";src:url("../fonts/Roboto-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"SQ Roboto";src:url("../fonts/Roboto-SemiBold.ttf") format("truetype");font-weight:500 700;font-display:swap}

body.sq-portal{
  --sq-navy:#0f1f3a; --sq-navy-90:#1b2c4b; --sq-gold:#c89b2c; --sq-gold-bg:#fbf6ea; --sq-gold-line:#e9d9ae;
  --sq-ink:#1d2433; --sq-ink-2:#4a5263; --sq-ink-3:#727a8b;
  --sq-line:#dde1e8; --sq-line-2:#eceef2; --sq-page:#f3f4f6;
  --sq-ok:#1e7a46; --sq-ok-bg:#e8f4ec; --sq-warn:#9a6700; --sq-warn-bg:#fdf3dd;
  --sq-bad:#b4372a; --sq-bad-bg:#fbebe9; --sq-info:#1f5fa8; --sq-info-bg:#e9f1fb;
  --sq-font:"SQ Roboto",Roboto,Arial,sans-serif; --sq-serif:"SQ Lora",Lora,Georgia,serif;
  background:var(--sq-page) !important;
  margin:0;
}

/* ---------- hide theme chrome on portal pages (Hello Elementor + block themes) ---------- */
body.sq-portal #site-header, body.sq-portal #site-footer, body.sq-portal .site-header, body.sq-portal .site-footer,
body.sq-portal header.wp-block-template-part, body.sq-portal footer.wp-block-template-part,
body.sq-portal .page-header, body.sq-portal .entry-title, body.sq-portal .wp-block-post-title,
body.sq-portal .elementor-location-header, body.sq-portal .elementor-location-footer{display:none !important}
body.sq-portal .wp-site-blocks, body.sq-portal main, body.sq-portal #content, body.sq-portal .site-main,
body.sq-portal .page-content, body.sq-portal .entry-content{padding:0 !important;margin:0 !important;max-width:none !important;width:100% !important}
body.sq-portal .wp-site-blocks > *, body.sq-portal .entry-content > *{margin-block-start:0 !important}
body.sq-portal .wp-site-blocks, body.sq-portal main.wp-block-group, body.sq-portal main .wp-block-group{padding-top:0 !important;padding-bottom:0 !important;margin-top:0 !important;margin-bottom:0 !important}
body.sq-portal .wp-block-spacer{display:none !important}
html:has(body.sq-portal){margin-top:0 !important}

/* ---------- shell ---------- */
body.sq-portal #safequal-admin-wrapper,
body.sq-portal #safequal-atp-wrapper,
body.sq-portal #safequal-learner-wrapper,
body.sq-portal #safequal-learner-info,
body.sq-portal #safequal-learner-assessments,
body.sq-portal .sq-shell{
  display:block !important; position:relative; width:100vw !important; max-width:none !important;
  left:50%; margin-left:-50vw !important; margin-right:0 !important;
  min-height:100vh; background:var(--sq-page) !important; border-radius:0 !important;
  font:14px/1.55 var(--sq-font); color:var(--sq-ink); -webkit-font-smoothing:antialiased;
}
body.sq-portal #safequal-admin-sidebar,
body.sq-portal #safequal-atp-sidebar,
body.sq-portal #safequal-learner-sidebar{
  background:none !important; padding:0 !important; min-height:0 !important; color:inherit !important; width:auto !important;
}
body.sq-portal #safequal-admin-content,
body.sq-portal #safequal-atp-content,
body.sq-portal #safequal-learner-content{
  width:auto !important; max-width:1200px; margin:0 auto; padding:24px 24px 48px !important; box-sizing:border-box;
}
body.sq-portal .sq-shell *, body.sq-portal [id^="safequal-"] *{box-sizing:border-box}

/* ---------- header ---------- */
/* role stylesheets hide every <header>/<footer>; bring ours back */
body.sq-portal header.sq-hdr, body.sq-portal footer.sq-ftr{display:block !important}
.sq-hdr{background:#fff;border-bottom:1px solid var(--sq-line)}
.sq-hdr-in{max-width:1200px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:18px}
.sq-logo{display:flex;align-items:center;gap:8px;text-decoration:none !important}
.sq-logo span{font:600 26px/1 var(--sq-serif);color:var(--sq-navy);letter-spacing:.2px}
.sq-logo img{height:38px;width:auto;display:block}
.sq-portal-name{border-left:1px solid var(--sq-line);padding-left:18px;color:var(--sq-ink-3);font-size:13px;line-height:1.3}
.sq-portal-name b{display:block;color:var(--sq-ink);font-size:14px;font-weight:500}
.sq-hdr-right{margin-left:auto;display:flex;align-items:center;gap:18px;font-size:13px}
.sq-hdr-user{text-align:right;line-height:1.3}
.sq-hdr-user b{display:block;font-weight:500;color:var(--sq-ink)}
.sq-hdr-user span{color:var(--sq-ink-3)}
a.sq-hdr-bell{position:relative;color:var(--sq-ink-2) !important;font-size:16px}
.sq-hdr-bell em{position:absolute;top:-7px;right:-10px;background:var(--sq-bad);color:#fff;font:700 10px/16px var(--sq-font);min-width:16px;height:16px;border-radius:8px;text-align:center;font-style:normal;padding:0 4px}
a.sq-hdr-out{color:var(--sq-ink-2) !important;display:inline-flex;align-items:center;gap:6px}
a.sq-hdr-out:hover{color:var(--sq-navy) !important}
/* role stylesheets force white links inside the old sidebar container */
body.sq-portal #safequal-admin-sidebar .sq-hdr a, body.sq-portal #safequal-atp-sidebar .sq-hdr a, body.sq-portal #safequal-learner-sidebar .sq-hdr a{color:var(--sq-ink-2) !important}
body.sq-portal #safequal-admin-sidebar .sq-hdr a:hover, body.sq-portal #safequal-atp-sidebar .sq-hdr a:hover, body.sq-portal #safequal-learner-sidebar .sq-hdr a:hover{color:var(--sq-navy) !important}

/* ---------- navigation ---------- */
.sq-nav{background:var(--sq-navy)}
.sq-nav-in{max-width:1200px;margin:0 auto;padding:0 24px;display:flex;gap:2px;overflow-x:auto;scrollbar-width:thin}
.sq-nav a{color:#d3d9e4 !important;padding:13px 13px 11px;font-size:13.5px;white-space:nowrap;border-bottom:3px solid transparent;text-decoration:none !important;display:block}
.sq-nav a:hover{color:#fff !important;background:var(--sq-navy-90)}
.sq-nav a.on{color:#fff !important;border-bottom-color:var(--sq-gold);font-weight:500}
.sq-nav .sq-n{display:inline-block;background:var(--sq-gold);color:var(--sq-navy);font-size:11px;font-weight:700;border-radius:3px;padding:0 5px;margin-left:6px;line-height:16px}

/* ---------- page heading ---------- */
body.sq-portal .portal-page-title,
body.sq-portal .sq-h1{font:600 26px/1.25 var(--sq-serif) !important;color:var(--sq-navy) !important;margin:0 0 18px !important;padding:0 !important;border:0 !important}
body.sq-portal .title-bottom-divider{display:none !important}
body.sq-portal #safequal-admin-content h3, body.sq-portal #safequal-atp-content h3, body.sq-portal #safequal-learner-content h3{font:600 17px/1.35 var(--sq-serif);color:var(--sq-navy);margin:22px 0 10px}
body.sq-portal #safequal-admin-content h2:not(.portal-page-title), body.sq-portal #safequal-atp-content h2:not(.portal-page-title), body.sq-portal #safequal-learner-content h2:not(.portal-page-title){font-family:var(--sq-serif);color:var(--sq-navy)}
body.sq-portal #safequal-admin-content h4, body.sq-portal #safequal-atp-content h4, body.sq-portal #safequal-learner-content h4{font-family:var(--sq-font)}
.sq-ph{display:flex;align-items:flex-end;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.sq-ph .sq-h1{margin:0 !important}
.sq-ph p{margin:3px 0 0;color:var(--sq-ink-2)}
.sq-ph .sq-act{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}

/* ---------- links ---------- */
body.sq-portal #safequal-admin-content a:not(.sq-btn):not(.safequal-btn),
body.sq-portal #safequal-atp-content a:not(.sq-btn):not(.safequal-btn),
body.sq-portal #safequal-learner-content a:not(.sq-btn):not(.safequal-btn){color:var(--sq-info) !important}

/* ---------- panels ---------- */
.sq-panel, body.sq-portal .safequal-card{background:#fff;border:1px solid var(--sq-line);border-radius:6px}
body.sq-portal .safequal-card{padding:18px;margin-bottom:20px}
.sq-panel{margin-bottom:20px}
.sq-panel-h{display:flex;align-items:center;gap:10px;padding:13px 18px;border-bottom:1px solid var(--sq-line)}
.sq-panel-h h2{font:600 17px/1.3 var(--sq-serif) !important;color:var(--sq-navy) !important;margin:0 !important}
.sq-panel-h .sq-r{margin-left:auto;font-size:13px}
.sq-panel-b{padding:18px}
.sq-panel-f{padding:11px 18px;border-top:1px solid var(--sq-line-2);font-size:12.5px;color:var(--sq-ink-3);background:#fafbfc;border-radius:0 0 6px 6px}
.sq-cols{display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px;align-items:start}
.sq-cols>*{min-width:0}

/* ---------- 3-column panels + simple list ---------- */
.sq-grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.sq-grid3 .sq-panel{margin-bottom:20px}
.sq-list{list-style:none;margin:0;padding:0}
.sq-list li{padding:10px 18px;border-bottom:1px solid var(--sq-line-2);font-size:13.5px;margin:0}
.sq-list li:last-child{border-bottom:0}
.sq-list li a{font-weight:500}
.sq-list li span{display:block;color:var(--sq-ink-3);font-size:12px}

/* ---------- stat line ---------- */
.sq-sline{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border:1px solid var(--sq-line);border-radius:6px;background:#fff;margin-bottom:20px;overflow:hidden}
.sq-sline > *{padding:14px 18px;border-right:1px solid var(--sq-line-2);border-bottom:1px solid var(--sq-line-2);color:var(--sq-ink) !important;text-decoration:none !important;display:block;margin-right:-1px;margin-bottom:-1px}
a.sq-sline-i:hover{background:#fafbfc}
.sq-sline b{display:block;font:600 24px/1.15 var(--sq-font);font-variant-numeric:tabular-nums;color:var(--sq-ink)}
.sq-sline span{color:var(--sq-ink-3);font-size:12.5px}
.sq-sline .sq-due b{color:var(--sq-warn)}

/* ---------- buttons ---------- */
body.sq-portal .sq-btn, body.sq-portal .safequal-btn,
body.sq-portal [id^="safequal-"] button, body.sq-portal [id^="safequal-"] input[type="submit"]{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:8px 14px;border-radius:4px;border:1px solid var(--sq-navy);
  background:var(--sq-navy);color:#fff !important;font:500 13.5px/1.2 var(--sq-font);cursor:pointer;text-decoration:none !important;white-space:nowrap;box-shadow:none;text-transform:none;letter-spacing:0
}
body.sq-portal .sq-btn:hover, body.sq-portal .safequal-btn:hover,
body.sq-portal [id^="safequal-"] button:hover, body.sq-portal [id^="safequal-"] input[type="submit"]:hover{background:var(--sq-navy-90);border-color:var(--sq-navy-90)}
body.sq-portal .sq-btn-2, body.sq-portal [id^="safequal-"] .sq-btn-2{background:#fff !important;color:var(--sq-ink) !important;border-color:var(--sq-line) !important}
body.sq-portal .sq-btn-2:hover, body.sq-portal [id^="safequal-"] .sq-btn-2:hover{background:#f6f7f9 !important}
body.sq-portal .sq-btn-ok, body.sq-portal [id^="safequal-"] .sq-btn-ok{background:var(--sq-ok) !important;border-color:var(--sq-ok) !important}
body.sq-portal .sq-btn-bad, body.sq-portal [id^="safequal-"] .sq-btn-bad{background:#fff !important;color:var(--sq-bad) !important;border-color:#e6c2bd !important}
body.sq-portal .sq-btn-sm, body.sq-portal [id^="safequal-"] .sq-btn-sm{padding:5px 10px;font-size:12.5px}
body.sq-portal [id^="safequal-"] button[value="fail"]{background:#fff;color:var(--sq-bad) !important;border-color:#e6c2bd}
body.sq-portal [id^="safequal-"] button[value="pass"]{background:var(--sq-ok);border-color:var(--sq-ok)}

/* ---------- status pills ---------- */
.sq-st{display:inline-block;font-size:12px;font-weight:500;padding:2px 8px;border-radius:3px;line-height:18px;white-space:nowrap}
.sq-st-ok{background:var(--sq-ok-bg);color:var(--sq-ok)} .sq-st-warn{background:var(--sq-warn-bg);color:var(--sq-warn)}
.sq-st-bad{background:var(--sq-bad-bg);color:var(--sq-bad)} .sq-st-info{background:var(--sq-info-bg);color:var(--sq-info)}
.sq-st-mute{background:#eef0f3;color:var(--sq-ink-2)}

/* ---------- key / value ---------- */
.sq-kv{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:13.5px}
.sq-kv dt{color:var(--sq-ink-3);margin:0} .sq-kv dd{margin:0;color:var(--sq-ink);font-weight:500;overflow-wrap:anywhere}
.sq-dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px 24px;margin:0}
.sq-dl dt{font-size:12px;color:var(--sq-ink-3);margin:0}
.sq-dl dd{margin:3px 0 0;font-weight:500;color:var(--sq-ink);overflow-wrap:anywhere}

/* ---------- tables ---------- */
body.sq-portal .sq-tw, body.sq-portal .safequal-table-wrap{overflow-x:auto;background:#fff;border:1px solid var(--sq-line);border-radius:6px;margin-bottom:20px}
body.sq-portal .sq-panel .sq-tw{border:0;border-radius:0;margin:0}
body.sq-portal table.safequal-table, body.sq-portal table.sq-t{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff;margin:0;border:0}
body.sq-portal table.safequal-table:not(.sq-in){border:1px solid var(--sq-line)}
body.sq-portal .safequal-table th, body.sq-portal .sq-t th{
  text-align:left;font-weight:500;color:var(--sq-ink-2) !important;background:#f7f8fa !important;padding:10px 14px !important;
  border:0 !important;border-bottom:1px solid var(--sq-line) !important;white-space:nowrap;font-size:13px
}
body.sq-portal .safequal-table td, body.sq-portal .sq-t td{padding:11px 14px !important;border:0 !important;border-bottom:1px solid var(--sq-line-2) !important;vertical-align:middle;color:var(--sq-ink)}
body.sq-portal .safequal-table tr:last-child td, body.sq-portal .sq-t tr:last-child td{border-bottom:0 !important}
body.sq-portal .safequal-table tbody tr:hover td, body.sq-portal .sq-t tbody tr:hover td{background:#fafbfc}
body.sq-portal .safequal-table td ul{margin:0;padding-left:16px}
.sq-t .sq-sub{display:block;color:var(--sq-ink-3);font-size:12px}
.sq-t .sq-ra{text-align:right}
.sq-num{font-variant-numeric:tabular-nums}
.sq-ini{width:32px;height:32px;flex:0 0 32px;border-radius:50%;background:#e4e8ef;color:var(--sq-navy);font:500 12px/32px var(--sq-font);text-align:center;display:inline-block;margin-right:10px;overflow:hidden}
.sq-ini img{width:100%;height:100%;object-fit:cover;display:block}
.sq-who{display:flex;align-items:center}

/* ---------- filter bar ---------- */
.sq-flt{display:flex;gap:8px;padding:12px 14px;border-bottom:1px solid var(--sq-line);flex-wrap:wrap}
body.sq-portal [id^="safequal-"] input.sq-search{flex:1;min-width:220px;margin:0 !important;padding-left:32px !important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%237a8293' stroke-width='2'%3E%3Ccircle cx='6' cy='6' r='5'/%3E%3Cpath d='m10 10 3 3'/%3E%3C/svg%3E") no-repeat 11px 50% !important}

/* ---------- forms ---------- */
body.sq-portal [id^="safequal-"] input[type="text"], body.sq-portal [id^="safequal-"] input[type="email"],
body.sq-portal [id^="safequal-"] input[type="number"], body.sq-portal [id^="safequal-"] input[type="date"],
body.sq-portal [id^="safequal-"] input[type="tel"], body.sq-portal [id^="safequal-"] input[type="password"],
body.sq-portal [id^="safequal-"] input[type="url"], body.sq-portal [id^="safequal-"] input[type="search"], body.sq-portal [id^="safequal-"] select,
body.sq-portal [id^="safequal-"] textarea{
  width:100%;max-width:100%;padding:8px 10px !important;border:1px solid #cdd2db !important;border-radius:4px !important;background:#fff !important;
  font:14px/1.4 var(--sq-font) !important;color:var(--sq-ink) !important;box-shadow:none !important;margin-bottom:14px
}
body.sq-portal [id^="safequal-"] input:focus, body.sq-portal [id^="safequal-"] select:focus, body.sq-portal [id^="safequal-"] textarea:focus{outline:2px solid #b9cbe4 !important;outline-offset:0;border-color:var(--sq-info) !important}
body.sq-portal [id^="safequal-"] label{font:500 13.5px/1.4 var(--sq-font) !important;color:var(--sq-ink) !important}
body.sq-portal .safequal-form, body.sq-portal .safequal-form-section{background:#fff;border:1px solid var(--sq-line);border-radius:6px;padding:20px;margin-bottom:20px}
body.sq-portal .safequal-checkbox-group label{font-weight:400 !important;display:flex !important;gap:8px;align-items:center}
body.sq-portal .safequal-checkbox-group input{width:auto !important;margin:0 !important}

/* ---------- programme cards ---------- */
.sq-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.sq-pcard{display:flex;flex-direction:column;margin:0;overflow:hidden}
.sq-pcard-img{height:140px;background:#f7f8fa;border-bottom:1px solid var(--sq-line-2);display:grid;place-items:center;color:#a3abba;font-size:30px;overflow:hidden}
.sq-pcard-img img{max-width:100%;max-height:100%;object-fit:contain;display:block;padding:12px}
.sq-pcard-b{padding:14px 16px;flex:1}
.sq-pcard-b h3{font:600 15.5px/1.35 var(--sq-serif) !important;color:var(--sq-navy) !important;margin:8px 0 4px !important}
.sq-pcard-b .sq-meta{font-size:12.5px;color:var(--sq-ink-3)}
.sq-pcard-f{padding:10px 16px;border-top:1px solid var(--sq-line-2)}

/* ---------- form layout (new forms) ---------- */
.sq-cols-r{grid-template-columns:minmax(0,1fr) 300px}
.sq-stepn{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--sq-navy);color:#fff;font:600 12px/1 var(--sq-font);margin-right:8px;vertical-align:2px}
.sq-note{margin:0 0 14px;font-size:13px;color:var(--sq-ink-2);background:#f7f8fa;border-left:3px solid var(--sq-gold);padding:8px 12px}
.sq-fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.sq-f{display:flex;flex-direction:column;gap:5px;min-width:0}
.sq-f-full{grid-column:1/-1}
body.sq-portal .sq-f input, body.sq-portal .sq-f select, body.sq-portal .sq-f textarea{margin:0 !important}
.sq-f small{font-size:12px;color:var(--sq-ink-3)}
body.sq-portal label em, .sq-req{color:var(--sq-bad);font-style:normal}
.sq-photo-pick{display:flex;gap:16px;align-items:center}
.sq-photo-box{width:96px;height:120px;border:1px dashed #c3c9d4;border-radius:6px;background:#fafbfc;display:grid;place-items:center;color:#a3abba;font-size:28px;overflow:hidden;flex:0 0 96px}
.sq-photo-box img{width:100%;height:100%;object-fit:cover;display:block}
.sq-checks{display:grid;gap:8px}
body.sq-portal label.sq-check{display:flex !important;gap:10px;align-items:center;border:1px solid var(--sq-line);border-radius:6px;padding:10px 12px;font-weight:400 !important;cursor:pointer;margin:0}
body.sq-portal label.sq-check:hover{background:#fafbfc}
body.sq-portal label.sq-check:has(input:checked){border-color:var(--sq-navy);background:#f4f6fa}
body.sq-portal label.sq-check input{width:auto !important;margin:0 !important}
.sq-form-actions{display:flex;gap:10px;align-items:center;margin:0 0 24px}
.sq-ticks{list-style:none;margin:0;padding:0;font-size:13.5px;color:var(--sq-ink-2)}
.sq-ticks li{position:relative;padding-left:22px;margin:0 0 8px}
.sq-ticks li::before{content:"";position:absolute;left:4px;top:6px;width:8px;height:4px;border-left:2px solid var(--sq-ok);border-bottom:2px solid var(--sq-ok);transform:rotate(-45deg)}

/* ---------- alerts ---------- */
body.sq-portal .safequal-success, body.sq-portal .sq-alert-ok{background:var(--sq-ok-bg) !important;border:1px solid #bfdfca !important;color:var(--sq-ok) !important;border-radius:6px !important;padding:12px 14px !important;margin-bottom:16px}
body.sq-portal .safequal-error, body.sq-portal .sq-alert-bad{background:var(--sq-bad-bg) !important;border:1px solid #efc7c1 !important;color:var(--sq-bad) !important;border-radius:6px !important;padding:12px 14px !important;margin-bottom:16px}
.sq-call{display:flex;gap:12px;padding:14px 16px;border:1px solid var(--sq-gold-line);background:var(--sq-gold-bg);border-radius:6px;font-size:13.5px;margin-bottom:20px}
.sq-call i{color:var(--sq-gold);margin-top:3px}
.sq-call-info{border-color:#c9dbf1;background:var(--sq-info-bg)} .sq-call-info i{color:var(--sq-info)}

/* ---------- pagination ---------- */
body.sq-portal .safequal-pagination{display:flex;gap:6px;flex-wrap:wrap;margin-top:16px}
body.sq-portal .safequal-pagination a, body.sq-portal .safequal-pagination span{border:1px solid var(--sq-line);border-radius:4px;padding:5px 10px;background:#fff;font-size:13px}
body.sq-portal .safequal-pagination .current-page{background:var(--sq-navy);border-color:var(--sq-navy);color:#fff}

/* ---------- learner card ---------- */
.sq-lc{text-align:center;padding:22px 18px 18px}
.sq-lc .sq-photo{width:88px;height:88px;border-radius:50%;background:#e4e8ef;color:var(--sq-navy);font:600 28px/88px var(--sq-serif);margin:0 auto 12px;border:3px solid #fff;box-shadow:0 0 0 1px var(--sq-line);overflow:hidden}
.sq-lc .sq-photo img{width:100%;height:100%;object-fit:cover;display:block}
.sq-lc h2{font:600 18px/1.3 var(--sq-serif) !important;color:var(--sq-navy) !important;margin:0 !important}
.sq-lc .sq-id{color:var(--sq-ink-3);font-size:12.5px;margin:2px 0 14px}
.sq-lc .sq-kv{text-align:left;border-top:1px solid var(--sq-line-2);padding-top:14px}

/* ---------- certificate row ---------- */
.sq-cert{display:flex;gap:16px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--sq-line-2)}
.sq-cert:last-child{border-bottom:0}
.sq-seal{flex:0 0 52px;width:52px;height:52px;border-radius:6px;background:var(--sq-gold-bg);border:1px solid var(--sq-gold-line);display:grid;place-items:center;color:var(--sq-gold);font-size:22px}
.sq-cert h3{font:600 15.5px/1.35 var(--sq-serif) !important;margin:0 0 2px !important;color:var(--sq-navy) !important}
.sq-cert .sq-meta{font-size:12.5px;color:var(--sq-ink-3)}
.sq-cert .sq-act{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}

/* ---------- profile (centre) ---------- */
.sq-prof{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:20px}
.sq-prof-logo{width:110px;height:110px;border:1px solid var(--sq-line);border-radius:6px;display:grid;place-items:center;background:#fff;overflow:hidden;padding:8px}
.sq-prof-logo img{max-width:100%;max-height:100%;object-fit:contain}
.sq-prof h2{font:600 22px/1.3 var(--sq-serif) !important;color:var(--sq-navy) !important;margin:0 0 6px !important}
.sq-prof .sq-tags{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.sq-meta-row{display:flex;gap:18px;flex-wrap:wrap;color:var(--sq-ink-2);font-size:13px}
.sq-meta-row i{margin-right:6px;color:#9aa3b5}
.sq-approved{border:1px solid var(--sq-gold-line);background:var(--sq-gold-bg);border-radius:6px;padding:14px 18px;text-align:center;min-width:180px}
.sq-approved img{height:46px;width:auto;display:block;margin:0 auto 6px}
.sq-approved b{display:block;color:var(--sq-navy);font:600 15px/1.3 var(--sq-serif)}
.sq-approved span{font-size:12px;color:#8a6b1c}

/* ---------- assessment ---------- */
.sq-timer{display:flex;gap:10px}
.sq-timer div{background:var(--sq-navy);color:#fff;border-radius:4px;padding:8px 0;width:64px;text-align:center}
.sq-timer b{display:block;font:600 22px/1.1 var(--sq-font);font-variant-numeric:tabular-nums;color:#fff}
.sq-timer span{font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:#aeb8ca}
.sq-steps{margin:0 0 16px;padding-left:18px;color:var(--sq-ink-2);font-size:13.5px}
.sq-steps li{margin:4px 0}
body.sq-portal label.sq-drop{position:relative;display:block !important;border:1.5px dashed #c3c9d4;border-radius:6px;padding:24px;text-align:center;color:var(--sq-ink-2) !important;background:#fafbfc;cursor:pointer;margin-bottom:14px;font-weight:400 !important}
label.sq-drop:hover{border-color:var(--sq-info);background:#f5f8fd}
label.sq-drop i{font-size:22px;color:var(--sq-ink-3);display:block;margin-bottom:6px}
label.sq-drop b{display:block;color:var(--sq-ink);font-weight:500}
label.sq-drop .sq-drop-name{display:block;font-size:12px;color:var(--sq-ink-3);margin-top:3px;overflow-wrap:anywhere}
label.sq-drop input[type=file]{position:absolute;width:1px;height:1px;opacity:0}
body.sq-portal label.sq-confirm{display:flex !important;gap:8px;align-items:flex-start;font-weight:400 !important;color:var(--sq-ink-2) !important;margin-bottom:16px}
label.sq-confirm input{margin-top:3px !important;width:auto !important}

/* ---------- row action popover (certificates) ---------- */
details.sq-act-menu{display:inline-block;position:relative;text-align:left}
details.sq-act-menu summary{list-style:none;cursor:pointer}
details.sq-act-menu summary::-webkit-details-marker{display:none}
.sq-act-pop{position:absolute;right:0;top:calc(100% + 6px);width:320px;background:#fff;border:1px solid var(--sq-line);border-radius:6px;box-shadow:0 8px 24px rgba(15,31,58,.14);padding:14px;z-index:20;white-space:normal;font-size:13px}
.sq-act-pop p{margin:4px 0 8px;color:var(--sq-ink-2);font-size:12.5px}
.sq-act-pop hr{border:0;border-top:1px solid var(--sq-line-2);margin:12px 0}
body.sq-portal .sq-act-pop textarea{margin-bottom:8px !important}
@media (min-width:861px){ body.sq-portal .sq-tw:has(#sq-certs){overflow:visible} }

/* ---------- empty state ---------- */
.sq-empty{padding:28px 18px;text-align:center;color:var(--sq-ink-3)}
.sq-empty i{display:block;font-size:22px;margin-bottom:8px;color:#a3abba}

/* ---------- footer ---------- */
.sq-ftr{border-top:1px solid var(--sq-line);background:#fff;font-size:12px;color:var(--sq-ink-3)}
.sq-ftr-in{max-width:1200px;margin:0 auto;padding:14px 24px;display:flex;gap:16px;flex-wrap:wrap}
.sq-ftr-in a{color:var(--sq-info) !important}
.sq-ftr-in span:last-child{margin-left:auto}

/* ---------- responsive ---------- */
@media (max-width:860px){
  .sq-hdr-in{padding:10px 16px;gap:12px}
  .sq-portal-name, .sq-hdr-user{display:none}
  .sq-logo span{font-size:22px} .sq-logo img{height:32px}
  .sq-nav-in, .sq-ftr-in{padding-left:16px;padding-right:16px}
  body.sq-portal #safequal-admin-content, body.sq-portal #safequal-atp-content, body.sq-portal #safequal-learner-content{padding:18px 16px 40px !important}
  .sq-cols, .sq-grid3, .sq-cols-r, .sq-fgrid{grid-template-columns:minmax(0,1fr)}
  .sq-cols > .sq-side{order:2}
  .sq-prof{grid-template-columns:1fr}
  .sq-cert{flex-wrap:wrap} .sq-cert .sq-act{margin-left:0}
  body.sq-portal .portal-page-title, body.sq-portal .sq-h1{font-size:22px !important}
}