/* ============================================================
   Inclusee — Accessibility Widget v1.3
   https://inclusee.com
   Copyright 2026 Widjits, Inc. | MIT License
   ============================================================ */

/* ── OpenDyslexic Font ───────────────────────────── */
@font-face{
  font-family:'IncluseeDyslexic';
  src:url('fonts/OpenDyslexic-Regular.woff2') format('woff2');
  font-weight:normal;font-style:normal;font-display:swap;
}

/* ── CSS Custom Properties ───────────────────────── */
:root{
  --inclusee-primary:#2563eb;
  --inclusee-primary-dark:#1d4ed8;
  --inclusee-accent:#10b981;
  --inclusee-bg:#1e293b;
  --inclusee-bg-dark:#0f172a;
  --inclusee-border:#334155;
  --inclusee-text:#e2e8f0;
  --inclusee-muted:#94a3b8;
  --inclusee-panel-width:360px;
  --inclusee-trigger-size:56px;
  --inclusee-z:2147483640;
}

/* ── Trigger Button ──────────────────────────────── */
#inclusee-trigger{
  position:fixed;bottom:24px;right:24px;z-index:var(--inclusee-z);
  width:var(--inclusee-trigger-size);height:var(--inclusee-trigger-size);
  border-radius:50%;border:none;
  background:var(--inclusee-primary);color:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 16px rgba(0,0,0,.3);
  transition:background .2s,transform .2s,box-shadow .2s;
  font-size:0;line-height:1;
}
#inclusee-trigger:hover{background:var(--inclusee-primary-dark);transform:scale(1.08);box-shadow:0 6px 24px rgba(0,0,0,.4)}
#inclusee-trigger:focus-visible{outline:3px solid var(--inclusee-accent);outline-offset:3px}
#inclusee-trigger svg{width:28px;height:28px;fill:currentColor}
#inclusee-trigger.inclusee-left{right:auto;left:24px}

/* ── Panel Container ─────────────────────────────── */
#inclusee-panel{
  position:fixed;top:0;right:0;z-index:calc(var(--inclusee-z) + 1);
  width:var(--inclusee-panel-width);height:100vh;
  background:var(--inclusee-bg);color:var(--inclusee-text);
  border-left:1px solid var(--inclusee-border);
  box-shadow:-8px 0 32px rgba(0,0,0,.4);
  transform:translateX(100%);transition:transform .3s ease;
  overflow-y:auto;overflow-x:hidden;
  font-family:Inter,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:14px;line-height:1.5;
  display:flex;flex-direction:column;
}
#inclusee-panel.inclusee-open{transform:translateX(0)}
#inclusee-panel.inclusee-panel-left{right:auto;left:0;border-left:none;border-right:1px solid var(--inclusee-border);transform:translateX(-100%)}
#inclusee-panel.inclusee-panel-left.inclusee-open{transform:translateX(0)}

/* ── Panel Header ────────────────────────────────── */
.inclusee-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 20px;border-bottom:1px solid var(--inclusee-border);
  background:var(--inclusee-bg-dark);flex-shrink:0;
}
.inclusee-header-title{
  font-size:16px;font-weight:700;display:flex;align-items:center;gap:8px;
}
.inclusee-header-title svg{width:20px;height:20px;fill:var(--inclusee-primary)}
.inclusee-close-btn{
  background:none;border:none;color:var(--inclusee-muted);cursor:pointer;
  width:32px;height:32px;display:flex;align-items:center;justify-content:center;
  border-radius:6px;transition:background .15s,color .15s;font-size:18px;
}
.inclusee-close-btn:hover{background:rgba(255,255,255,.08);color:var(--inclusee-text)}

/* ── Panel Body ──────────────────────────────────── */
.inclusee-body{flex:1;overflow-y:auto;padding:16px 20px}
.inclusee-body::-webkit-scrollbar{width:6px}
.inclusee-body::-webkit-scrollbar-track{background:transparent}
.inclusee-body::-webkit-scrollbar-thumb{background:var(--inclusee-border);border-radius:3px}

/* ── Panel Footer (Reset + Position) ─────────────── */
.inclusee-footer{
  padding:12px 20px;border-top:1px solid var(--inclusee-border);
  background:var(--inclusee-bg-dark);flex-shrink:0;
  display:flex;gap:8px;
}
.inclusee-footer-btn{
  flex:1;padding:8px 12px;border:1px solid var(--inclusee-border);
  border-radius:6px;background:transparent;color:var(--inclusee-muted);
  font-size:12px;font-weight:600;cursor:pointer;
  transition:background .15s,color .15s,border-color .15s;
  text-align:center;
}
.inclusee-footer-btn:hover{background:rgba(255,255,255,.06);color:var(--inclusee-text);border-color:var(--inclusee-muted)}
.inclusee-footer-btn.inclusee-reset-btn:hover{border-color:#ef4444;color:#ef4444}

/* ── Section Groups ──────────────────────────────── */
.inclusee-section{margin-bottom:20px}
.inclusee-section-title{
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--inclusee-muted);margin-bottom:10px;padding-bottom:6px;
  border-bottom:1px solid var(--inclusee-border);
  display:flex;align-items:center;gap:6px;
}
.inclusee-section-title svg{width:14px;height:14px;fill:var(--inclusee-muted)}

/* ── Profile Cards ───────────────────────────────── */
.inclusee-profiles{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.inclusee-profile-btn{
  padding:10px 8px;border:1px solid var(--inclusee-border);border-radius:8px;
  background:transparent;color:var(--inclusee-text);cursor:pointer;
  text-align:center;font-size:12px;font-weight:600;
  transition:background .15s,border-color .15s;
  display:flex;flex-direction:column;align-items:center;gap:4px;
}
.inclusee-profile-btn:hover{background:rgba(37,99,235,.08);border-color:var(--inclusee-primary)}
.inclusee-profile-btn.inclusee-active{background:rgba(37,99,235,.15);border-color:var(--inclusee-primary);color:var(--inclusee-primary)}
.inclusee-profile-btn .inclusee-profile-icon{font-size:20px;line-height:1}
.inclusee-profile-btn .inclusee-profile-label{font-size:11px;line-height:1.2}

/* ── Toggle Row ──────────────────────────────────── */
.inclusee-toggle-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 0;border-bottom:1px solid rgba(51,65,85,.5);
}
.inclusee-toggle-row:last-child{border-bottom:none}
.inclusee-toggle-label{font-size:13px;font-weight:500;color:var(--inclusee-text)}
.inclusee-toggle{
  position:relative;width:40px;height:22px;flex-shrink:0;
}
.inclusee-toggle input{opacity:0;width:0;height:0;position:absolute}
.inclusee-toggle-track{
  position:absolute;top:0;left:0;right:0;bottom:0;
  background:var(--inclusee-border);border-radius:11px;
  cursor:pointer;transition:background .2s;
}
.inclusee-toggle-track::after{
  content:'';position:absolute;top:2px;left:2px;
  width:18px;height:18px;border-radius:50%;
  background:#fff;transition:transform .2s;
}
.inclusee-toggle input:checked+.inclusee-toggle-track{background:var(--inclusee-primary)}
.inclusee-toggle input:checked+.inclusee-toggle-track::after{transform:translateX(18px)}
.inclusee-toggle input:focus-visible+.inclusee-toggle-track{box-shadow:0 0 0 3px rgba(37,99,235,.4)}

/* ── Stepper Row (for multi-level settings) ──────── */
.inclusee-stepper-row{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 0;border-bottom:1px solid rgba(51,65,85,.5);
}
.inclusee-stepper-row:last-child{border-bottom:none}
.inclusee-stepper-label{font-size:13px;font-weight:500;color:var(--inclusee-text)}
.inclusee-stepper{display:flex;align-items:center;gap:6px}
.inclusee-stepper-btn{
  width:28px;height:28px;border:1px solid var(--inclusee-border);border-radius:6px;
  background:transparent;color:var(--inclusee-text);font-size:16px;font-weight:700;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .15s,border-color .15s;line-height:1;
}
.inclusee-stepper-btn:hover{background:rgba(37,99,235,.12);border-color:var(--inclusee-primary)}
.inclusee-stepper-btn:disabled{opacity:.3;cursor:not-allowed}
.inclusee-stepper-value{
  min-width:32px;text-align:center;font-size:13px;font-weight:700;color:var(--inclusee-primary);
}

/* ── Radio Group (for text alignment, cursor) ────── */
.inclusee-radio-group{display:flex;gap:4px;flex-shrink:0}
.inclusee-radio-btn{
  width:32px;height:28px;border:1px solid var(--inclusee-border);border-radius:6px;
  background:transparent;color:var(--inclusee-muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,border-color .15s,color .15s;
}
.inclusee-radio-btn:hover{background:rgba(37,99,235,.08);border-color:var(--inclusee-primary)}
.inclusee-radio-btn.inclusee-active{background:rgba(37,99,235,.15);border-color:var(--inclusee-primary);color:var(--inclusee-primary)}
.inclusee-radio-btn svg{width:14px;height:14px;fill:currentColor}

/* ── Page Structure Modal ────────────────────────── */
.inclusee-structure-modal{
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:calc(var(--inclusee-z) + 2);
  width:90vw;max-width:480px;max-height:70vh;
  background:var(--inclusee-bg);border:1px solid var(--inclusee-border);
  border-radius:12px;box-shadow:0 16px 48px rgba(0,0,0,.5);
  display:none;flex-direction:column;overflow:hidden;
}
.inclusee-structure-modal.inclusee-open{display:flex}
.inclusee-structure-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;border-bottom:1px solid var(--inclusee-border);
}
.inclusee-structure-header h3{font-size:15px;font-weight:700}
.inclusee-structure-list{
  overflow-y:auto;padding:12px 20px;flex:1;
}
.inclusee-structure-item{
  display:block;padding:8px 12px;margin-bottom:4px;
  border-radius:6px;color:var(--inclusee-text);
  text-decoration:none;font-size:13px;cursor:pointer;
  transition:background .15s;border:none;background:none;width:100%;text-align:left;
}
.inclusee-structure-item:hover{background:rgba(37,99,235,.1)}
.inclusee-structure-item[data-level="1"]{font-weight:700;font-size:15px}
.inclusee-structure-item[data-level="2"]{padding-left:24px;font-weight:600}
.inclusee-structure-item[data-level="3"]{padding-left:36px}
.inclusee-structure-item[data-level="4"]{padding-left:48px;font-size:12px}
.inclusee-structure-item[data-level="5"]{padding-left:60px;font-size:12px}
.inclusee-structure-item[data-level="6"]{padding-left:72px;font-size:12px}
.inclusee-structure-backdrop{
  position:fixed;top:0;left:0;width:100vw;height:100vh;
  background:rgba(0,0,0,.5);z-index:calc(var(--inclusee-z) + 1);
  display:none;
}
.inclusee-structure-backdrop.inclusee-open{display:block}

/* ── Reading Guide ───────────────────────────────── */
#inclusee-reading-guide{
  position:fixed;left:0;width:100vw;height:2px;
  background:var(--inclusee-primary);z-index:calc(var(--inclusee-z) - 1);
  pointer-events:none;display:none;
  box-shadow:0 0 8px rgba(37,99,235,.5);
}
html.inclusee-reading-guide #inclusee-reading-guide{display:block}

/* ── Reading Mask ────────────────────────────────── */
#inclusee-reading-mask{
  position:fixed;top:0;left:0;width:100vw;height:100vh;
  z-index:calc(var(--inclusee-z) - 1);pointer-events:none;display:none;
}
html.inclusee-reading-mask #inclusee-reading-mask{display:block}
#inclusee-reading-mask .inclusee-mask-top,
#inclusee-reading-mask .inclusee-mask-bottom{
  position:absolute;left:0;width:100%;background:rgba(0,0,0,.65);
}
#inclusee-reading-mask .inclusee-mask-top{top:0}
#inclusee-reading-mask .inclusee-mask-bottom{bottom:0}

/* ── Overlay (panel backdrop on mobile) ──────────── */
#inclusee-overlay{
  position:fixed;top:0;left:0;width:100vw;height:100vh;
  background:rgba(0,0,0,.4);z-index:var(--inclusee-z);
  display:none;
}
#inclusee-overlay.inclusee-open{display:block}

/* ============================================================
   ACCESSIBILITY OVERRIDE CLASSES
   Applied to <html> element to affect host page content
   ============================================================ */

/* ── Font Size ───────────────────────────────────── */
html.inclusee-font-lg-1 *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *){font-size:110% !important}
html.inclusee-font-lg-2 *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *){font-size:125% !important}
html.inclusee-font-lg-3 *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *){font-size:150% !important}
html.inclusee-font-lg-4 *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *){font-size:175% !important}
html.inclusee-font-lg-5 *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *){font-size:200% !important}

/* ── Readable Font ───────────────────────────────── */
html.inclusee-readable-font *:not(#inclusee-panel *):not(#inclusee-trigger *){
  font-family:Arial,Helvetica,'Segoe UI',sans-serif !important;
}

/* ── Dyslexia Font ───────────────────────────────── */
html.inclusee-dyslexia-font *:not(#inclusee-panel *):not(#inclusee-trigger *){
  font-family:'IncluseeDyslexic','OpenDyslexic',sans-serif !important;
}

/* ── Letter Spacing ──────────────────────────────── */
html.inclusee-letter-sp-1 *:not(#inclusee-panel *):not(#inclusee-trigger *){letter-spacing:.05em !important}
html.inclusee-letter-sp-2 *:not(#inclusee-panel *):not(#inclusee-trigger *){letter-spacing:.1em !important}
html.inclusee-letter-sp-3 *:not(#inclusee-panel *):not(#inclusee-trigger *){letter-spacing:.15em !important}

/* ── Word Spacing ────────────────────────────────── */
html.inclusee-word-sp-1 *:not(#inclusee-panel *):not(#inclusee-trigger *){word-spacing:.1em !important}
html.inclusee-word-sp-2 *:not(#inclusee-panel *):not(#inclusee-trigger *){word-spacing:.2em !important}
html.inclusee-word-sp-3 *:not(#inclusee-panel *):not(#inclusee-trigger *){word-spacing:.35em !important}

/* ── Line Height ─────────────────────────────────── */
html.inclusee-line-ht-1 *:not(#inclusee-panel *):not(#inclusee-trigger *){line-height:1.6 !important}
html.inclusee-line-ht-2 *:not(#inclusee-panel *):not(#inclusee-trigger *){line-height:1.8 !important}
html.inclusee-line-ht-3 *:not(#inclusee-panel *):not(#inclusee-trigger *){line-height:2.2 !important}

/* ── Text Alignment ──────────────────────────────── */
html.inclusee-align-left *:not(#inclusee-panel *):not(#inclusee-trigger *){text-align:left !important}
html.inclusee-align-center *:not(#inclusee-panel *):not(#inclusee-trigger *){text-align:center !important}
html.inclusee-align-right *:not(#inclusee-panel *):not(#inclusee-trigger *){text-align:right !important}

/* ── Bold Text ───────────────────────────────────── */
html.inclusee-bold-text *:not(#inclusee-panel *):not(#inclusee-trigger *){font-weight:bold !important}

/* ── High Contrast ───────────────────────────────── */
html.inclusee-high-contrast *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *):not(#inclusee-reading-guide):not(#inclusee-reading-mask):not(#inclusee-reading-mask *):not(#inclusee-overlay):not(.inclusee-structure-backdrop){
  background-color:#000 !important;color:#fff !important;border-color:#fff !important;
}
html.inclusee-high-contrast a:not(#inclusee-panel a){color:#ff0 !important}
html.inclusee-high-contrast img{filter:contrast(1.2) !important}

/* ── Dark Contrast ───────────────────────────────── */
html.inclusee-dark-contrast *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *):not(#inclusee-reading-guide):not(#inclusee-reading-mask):not(#inclusee-reading-mask *):not(#inclusee-overlay):not(.inclusee-structure-backdrop){
  background-color:#1a1a2e !important;color:#e0e0e0 !important;
}
html.inclusee-dark-contrast a:not(#inclusee-panel a){color:#6db3f2 !important}

/* ── Light Contrast ──────────────────────────────── */
html.inclusee-light-contrast *:not(#inclusee-panel *):not(#inclusee-trigger):not(#inclusee-trigger *):not(#inclusee-reading-guide):not(#inclusee-reading-mask):not(#inclusee-reading-mask *):not(#inclusee-overlay):not(.inclusee-structure-backdrop){
  background-color:#fff !important;color:#000 !important;
}
html.inclusee-light-contrast a:not(#inclusee-panel a){color:#0000ee !important}


html.inclusee-invert img,html.inclusee-invert video,html.inclusee-invert svg:not(#inclusee-panel svg):not(#inclusee-trigger svg){filter:invert(1) hue-rotate(180deg)}
html.inclusee-invert #inclusee-panel,html.inclusee-invert #inclusee-trigger{filter:invert(1) hue-rotate(180deg)}

/* ── Monochrome ──────────────────────────────────── */
html.inclusee-monochrome{filter:grayscale(100%)}
html.inclusee-monochrome #inclusee-panel,html.inclusee-monochrome #inclusee-trigger{filter:grayscale(0)}

/* ── Saturation ──────────────────────────────────── */
html.inclusee-low-saturation{filter:saturate(.4)}
html.inclusee-low-saturation #inclusee-panel,html.inclusee-low-saturation #inclusee-trigger{filter:saturate(1)}
html.inclusee-high-saturation{filter:saturate(2)}
html.inclusee-high-saturation #inclusee-panel,html.inclusee-high-saturation #inclusee-trigger{filter:saturate(1)}

/* ── Keyboard Navigation ─────────────────────────── */
html.inclusee-keyboard-nav *:focus{outline:3px solid var(--inclusee-primary) !important;outline-offset:2px !important}

/* ── Focus Indicator Enhancement ─────────────────── */
html.inclusee-focus-indicator *:focus-visible{
  outline:3px solid #fbbf24 !important;outline-offset:3px !important;
  box-shadow:0 0 0 6px rgba(251,191,36,.35) !important;
}

/* ── Highlight Links ─────────────────────────────── */
html.inclusee-highlight-links a:not(#inclusee-panel a){
  outline:3px solid #60a5fa !important;
  outline-offset:3px !important;
  text-decoration:underline !important;
  background:rgba(96,165,250,.12) !important;
  padding:2px 4px !important;
  border-radius:3px !important;
}

/* ── Highlight Headings ──────────────────────────── */
html.inclusee-highlight-headings h1:not(#inclusee-panel h1),
html.inclusee-highlight-headings h2:not(#inclusee-panel h2),
html.inclusee-highlight-headings h3:not(#inclusee-panel h3),
html.inclusee-highlight-headings h4:not(#inclusee-panel h4),
html.inclusee-highlight-headings h5:not(#inclusee-panel h5),
html.inclusee-highlight-headings h6:not(#inclusee-panel h6){
  outline:3px solid #34d399 !important;
  outline-offset:6px !important;
  background:rgba(52,211,153,.08) !important;
}

/* ── Big Cursors ─────────────────────────────────── */
html.inclusee-big-cursor-black,html.inclusee-big-cursor-black *{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M5 2l20 14-10 2 6 12-4 2-6-12-6 8z' fill='%23000' stroke='%23fff' stroke-width='1'/%3E%3C/svg%3E") 5 2,auto !important;
}
html.inclusee-big-cursor-white,html.inclusee-big-cursor-white *{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Cpath d='M5 2l20 14-10 2 6 12-4 2-6-12-6 8z' fill='%23fff' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") 5 2,auto !important;
}

/* ── Stop Animations ─────────────────────────────── */
html.inclusee-stop-animations *:not(#inclusee-panel *):not(#inclusee-trigger *),
html.inclusee-stop-animations *:not(#inclusee-panel *)::before,
html.inclusee-stop-animations *:not(#inclusee-panel *)::after{
  animation-duration:0.001s !important;
  animation-iteration-count:1 !important;
  transition-duration:0.001s !important;
  scroll-behavior:auto !important;
}

/* ── Reduce Motion ───────────────────────────────── */
html.inclusee-reduce-motion{scroll-behavior:auto !important}
html.inclusee-reduce-motion *:not(#inclusee-panel *){
  animation:none !important;transition:none !important;
}

/* ── Hide Images ─────────────────────────────────── */
html.inclusee-hide-images img:not(#inclusee-panel img):not(#inclusee-trigger img){
  visibility:hidden !important;position:relative !important;
}
html.inclusee-hide-images img:not(#inclusee-panel img):not(#inclusee-trigger img)::after{
  content:attr(alt);visibility:visible;display:block;
  position:absolute;top:0;left:0;
  padding:4px 8px;background:#f1f5f9;color:#334155;
  font-size:12px;border:1px dashed #94a3b8;
}

/* ── Image Alt Tooltips ──────────────────────────── */
html.inclusee-show-alt img[alt]:not(#inclusee-panel img){position:relative}
html.inclusee-show-alt img[alt]:not(#inclusee-panel img):hover::after{
  content:attr(alt);position:absolute;bottom:100%;left:0;
  padding:4px 8px;background:#1e293b;color:#e2e8f0;
  font-size:12px;border-radius:4px;white-space:nowrap;max-width:300px;
  z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.3);
}

/* ── Powered-by Lead Gen (single-line) ────────────── */
.inclusee-powered-by{
  display:flex;align-items:center;justify-content:center;gap:6px;
  text-decoration:none;
  padding:12px 20px;flex-shrink:0;
  border-top:1px solid var(--inclusee-border);
  background:var(--inclusee-bg-dark);
  transition:background .2s;
}
.inclusee-powered-by:hover{background:#162032}
.inclusee-powered-by-brand{
  font-size:12px;color:var(--inclusee-muted);white-space:nowrap;
}
.inclusee-powered-by-brand svg{display:none}
.inclusee-powered-by-brand strong{color:var(--inclusee-text);font-weight:600}
.inclusee-powered-by-cta{
  font-size:12px;font-weight:600;
  color:var(--inclusee-primary);white-space:nowrap;
}
.inclusee-powered-by:hover .inclusee-powered-by-cta{color:#60a5fa;text-decoration:underline}

/* ── Responsive Panel ────────────────────────────── */
@media(max-width:420px){
  #inclusee-panel{width:100vw;--inclusee-panel-width:100vw}
  .inclusee-profiles{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:320px){
  .inclusee-profiles{grid-template-columns:1fr}
}
