/* Approved 22 Oct Figma pattern adaptation. Presentation only. */
@font-face{font-family:SilsilaKitArchivo;src:url('/fonts/archivo-variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:SilsilaKitArabic;src:url('/fonts/noto-sans-arabic-variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
#root :is(.silsila-kit-resources,.customer-portal,.staff-portal){font-family:SilsilaKitArchivo,Arial,sans-serif}
#root :is(.silsila-kit-resources,.customer-portal,.staff-portal):lang(ar),#root [dir="rtl"] .silsila-kit-resources,#root :is(.customer-portal,.staff-portal)[dir="rtl"]{font-family:SilsilaKitArabic,Arial,sans-serif}
#root :is(.silsila-kit-resources,.customer-portal,.staff-portal) :is(h1,h2,h3,button,input,select,textarea){font-family:inherit}
#root :is(.customer-portal,.staff-portal){--silsila-kit-border:#d6e2f1;--silsila-kit-surface:#f6f9fd}
#root :is(.customer-portal,.staff-portal) aside nav a[aria-current="page"]{background:#0d2d59;color:#fff;border-inline-start:3px solid #ffbf19;font-weight:600}
#root :is(.customer-portal,.staff-portal) aside nav a[aria-current="page"]>svg{color:inherit}
#root :is(.customer-portal,.staff-portal) aside nav a[aria-current="page"]::before{filter:brightness(0) invert(1)}
#root :is(.customer-portal,.staff-portal) .workspace-tabs [role="tab"][aria-selected="true"]{background:#0d2d59;color:#fff;border-radius:8px;border-block-end:3px solid #ffbf19}
#root :is(.customer-portal,.staff-portal) .workspace-surface{border:1px solid var(--silsila-kit-border);border-radius:12px}
#root :is(.customer-portal,.staff-portal) :is(.workspace-task-editor,.customer-next-actions){padding:16px}
#root :is(.customer-portal,.staff-portal) .workspace-surface>h2{margin-block-end:12px}
#root :is(.customer-portal,.staff-portal) .workspace-surface>p{line-height:1.5}
#root .silsila-kit-resources{max-width:1312px;margin-inline:auto}
#root .silsila-kit-resources .prototype-public-header{padding:24px;margin-block-end:16px;border-radius:8px}
#root .silsila-kit-resources .prototype-public-header h1{font-size:36px;line-height:1.45;font-weight:600}
#root .silsila-kit-resources .prototype-public-header p{font-size:14px;line-height:1.45;margin-block-start:12px}
#root .silsila-kit-resources>nav{gap:8px;margin-block-end:16px}
#root .silsila-kit-resources>nav button{min-height:44px;border-radius:8px}
#root .silsila-kit-resources>nav button[aria-pressed="true"]{background:#0d2d59;color:white;border-color:#0d2d59}
#root .silsila-kit-resources>.prototype-public-stack{display:flex;flex-direction:column;gap:12px;counter-reset:resource-guide}
#root .silsila-kit-resources>.prototype-public-stack>.workspace-surface{position:relative;min-width:0;height:auto;overflow:visible;border:1px solid #d6e2f1;border-radius:8px;padding:20px;background:#fff}
#root .silsila-kit-resources>.prototype-public-stack>section.workspace-surface{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-height:160px}
#root .silsila-kit-resources>.prototype-public-stack>section.workspace-surface:lang(ar){align-items:flex-start}
#root .silsila-kit-resources .kit-resource-label{font-size:11px;font-weight:400;color:#435774;margin:0;line-height:1.45}
#root .silsila-kit-resources>.prototype-public-stack>.workspace-surface h2{font-size:18px;line-height:1.45;margin:0;color:#061d33}
#root .silsila-kit-resources>.prototype-public-stack>.workspace-surface>p:not(.kit-resource-label){font-size:14px;line-height:1.45;color:#435774;margin:0}
#root .silsila-kit-resources>.prototype-public-stack>.workspace-surface .prototype-button{min-height:44px;border-radius:8px;margin-block-start:0;font-size:12px;padding:10px 16px}
#root .silsila-kit-resources .kit-single-destination>a::after{content:"";position:absolute;inset:0;border-radius:8px}
#root .silsila-kit-resources .kit-single-destination:hover{border-color:#1763b4;background:#f6f9fd}
#root .silsila-kit-resources .kit-single-destination:focus-within{outline:3px solid #1763b4;outline-offset:2px}
#root .silsila-kit-resources>.prototype-public-stack>details summary{min-height:44px;cursor:pointer}
@media(max-width:760px){#root .silsila-kit-resources .prototype-public-header h1{font-size:26px}#root .silsila-kit-resources .prototype-public-header{padding:24px}#root :is(.customer-portal,.staff-portal) .workspace-surface{min-width:0}}
@media(prefers-reduced-motion:reduce){#root .silsila-kit-resources *{scroll-behavior:auto}}
