*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter,Segoe UI,ui-sans-serif,system-ui,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}input:where(:not([type])),input:where([type=date]),input:where([type=datetime-local]),input:where([type=email]),input:where([type=month]),input:where([type=number]),input:where([type=password]),input:where([type=search]),input:where([type=tel]),input:where([type=text]),input:where([type=time]),input:where([type=url]),input:where([type=week]),select,select:where([multiple]),textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow:0 0 #0000}input:where(:not([type])):focus,input:where([type=date]):focus,input:where([type=datetime-local]):focus,input:where([type=email]):focus,input:where([type=month]):focus,input:where([type=number]):focus,input:where([type=password]):focus,input:where([type=search]):focus,input:where([type=tel]):focus,input:where([type=text]):focus,input:where([type=time]):focus,input:where([type=url]):focus,input:where([type=week]):focus,select:focus,select:where([multiple]):focus,textarea:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-top:0;padding-bottom:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}select:where([multiple]),select:where([size]:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}input:where([type=checkbox]),input:where([type=radio]){-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#2563eb;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow:0 0 #0000}input:where([type=checkbox]){border-radius:0}input:where([type=radio]){border-radius:100%}input:where([type=checkbox]):focus,input:where([type=radio]):focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}input:where([type=checkbox]):checked,input:where([type=radio]):checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}input:where([type=checkbox]):checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E")}@media (forced-colors:active) {input:where([type=checkbox]):checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}input:where([type=radio]):checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}@media (forced-colors:active) {input:where([type=radio]):checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}input:where([type=checkbox]):checked:focus,input:where([type=checkbox]):checked:hover,input:where([type=radio]):checked:focus,input:where([type=radio]):checked:hover{border-color:transparent;background-color:currentColor}input:where([type=checkbox]):indeterminate{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media (forced-colors:active) {input:where([type=checkbox]):indeterminate{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}input:where([type=checkbox]):indeterminate:focus,input:where([type=checkbox]):indeterminate:hover{border-color:transparent;background-color:currentColor}input:where([type=file]){background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit}input:where([type=file]):focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}:root{--mv-bg:246 248 252;--mv-surface:255 255 255;--mv-surface-2:248 250 252;--mv-surface-3:226 232 240;--mv-border:226 232 240;--mv-border-strong:203 213 225;--mv-text:15 23 42;--mv-text-muted:71 85 105;--mv-text-soft:100 116 139;--mv-primary:31 111 232;--mv-primary-hover:27 91 204;--mv-focus:31 111 232;--mv-shadow:15 23 42;--mv-success:16 185 129;--mv-success-soft:209 250 229;--mv-warning:245 158 11;--mv-warning-soft:254 243 199;--mv-danger:239 68 68;--mv-danger-soft:254 226 226;--mv-info:59 130 246;--mv-info-soft:219 234 254}html{font-size:15px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Inter,Segoe UI,ui-sans-serif,system-ui,sans-serif;font-size:15px;line-height:1.5rem;background-color:rgb(var(--mv-bg));color:rgb(var(--mv-text))}::-moz-selection{background-color:rgb(var(--mv-primary)/.15);color:rgb(var(--mv-text))}::selection{background-color:rgb(var(--mv-primary)/.15);color:rgb(var(--mv-text))}::-webkit-scrollbar{width:.75rem;height:.75rem}::-webkit-scrollbar-track{background:rgb(var(--mv-surface-2))}::-webkit-scrollbar-thumb{background:rgb(var(--mv-surface-3));border-radius:9999px;border:2px solid rgb(var(--mv-surface-2))}::-webkit-scrollbar-thumb:hover{background:rgb(var(--mv-border-strong))}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media (prefers-contrast:high){a,button{text-decoration-line:underline;text-decoration-thickness:2px}}[ng-cloak]{display:none!important}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.form-input,.form-multiselect,.form-select,.form-textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow:0 0 #0000}.form-input:focus,.form-multiselect:focus,.form-select:focus,.form-textarea:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}.form-select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}.form-select:where([size]:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}.tw-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.tw-btn-primary:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.tw-btn-primary{--tw-bg-opacity:1;background-color:rgb(31 111 232/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.tw-btn-primary:hover{--tw-bg-opacity:1;background-color:rgb(27 91 204/var(--tw-bg-opacity,1))}.tw-btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.tw-btn-secondary:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.tw-btn-secondary{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.tw-btn-secondary:hover{--tw-border-opacity:1;border-color:rgb(147 197 253/var(--tw-border-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.tw-btn-danger{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.tw-btn-danger:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.tw-btn-danger{--tw-bg-opacity:1;background-color:rgb(244 63 94/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.tw-btn-danger:hover{--tw-bg-opacity:1;background-color:rgb(225 29 72/var(--tw-bg-opacity,1))}.tw-btn-success{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.tw-btn-success:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.tw-btn-success{--tw-bg-opacity:1;background-color:rgb(16 185 129/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.tw-btn-success:hover{--tw-bg-opacity:1;background-color:rgb(5 150 105/var(--tw-bg-opacity,1))}.tw-btn-warning{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.tw-btn-warning:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.tw-btn-warning{--tw-bg-opacity:1;background-color:rgb(245 158 11/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.tw-btn-warning:hover{--tw-bg-opacity:1;background-color:rgb(217 119 6/var(--tw-bg-opacity,1))}.tw-btn-info{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.tw-btn-info:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.tw-btn-info{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.tw-btn-info:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity,1))}.tw-toggle-btn.is-active{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1));--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.tw-status-info{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(29 78 216/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(191 219 254/var(--tw-ring-opacity,1))}.tw-status-info,.tw-status-neutral{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;line-height:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.tw-status-neutral{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(71 85 105/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(226 232 240/var(--tw-ring-opacity,1))}.view-ui-page{min-height:100vh;--tw-bg-opacity:1;background-color:rgb(246 248 252/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.view-ui-page .content-pd,.view-ui-page.view-ui-page--announcement,.view-ui-page.view-ui-page--coupons,.view-ui-page.view-ui-page--coupons-learner{padding:1rem}@media (min-width:768px){.view-ui-page .content-pd,.view-ui-page.view-ui-page--announcement,.view-ui-page.view-ui-page--coupons,.view-ui-page.view-ui-page--coupons-learner{padding:1.5rem}}.view-ui-header{margin-bottom:1.5rem;display:flex;flex-direction:column;gap:1rem;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));background-color:hsla(0,0%,100%,.95);padding:1.25rem;--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}@media (min-width:768px){.view-ui-header{flex-direction:row;align-items:flex-start;justify-content:space-between;padding:1.5rem}}.view-ui-title{margin:0;font-size:1.875rem;line-height:2.25rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.view-ui-breadcrumb{margin-top:.75rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.view-ui-breadcrumb a{--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1));text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.view-ui-breadcrumb a:hover{--tw-text-opacity:1;color:rgb(45 127 249/var(--tw-text-opacity,1))}.view-ui-actions,.view-ui-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.view-ui-panel{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding:1.25rem;--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}@media (min-width:768px){.view-ui-panel{padding:1.5rem}}.view-ui-panel__header{margin-bottom:1.25rem;display:flex;flex-direction:column;gap:1rem}@media (min-width:768px){.view-ui-panel__header{flex-direction:row;align-items:flex-start;justify-content:space-between}}.view-ui-panel__title{font-size:1.25rem;line-height:1.75rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.view-ui-panel__subtitle{margin-top:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.view-ui-search{height:2.75rem;min-width:16rem;border-radius:.5rem;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding-left:1rem;padding-right:1rem;font-size:.875rem;line-height:1.25rem;--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.view-ui-search:focus{--tw-border-opacity:1;border-color:rgb(45 127 249/var(--tw-border-opacity,1));--tw-ring-opacity:1;--tw-ring-color:rgb(45 127 249/var(--tw-ring-opacity,1))}.view-ui-alert{margin-bottom:1.5rem;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(253 230 138/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 251 235/var(--tw-bg-opacity,1));padding:1rem;--tw-text-opacity:1;color:rgb(120 53 15/var(--tw-text-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color)}.tw-alert-info,.view-ui-alert{font-size:.875rem;line-height:1.25rem;font-weight:500;box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.tw-alert-info{border-radius:.5rem;border-width:1px;border-color:rgb(191 219 254/var(--tw-border-opacity,1));background-color:rgb(239 246 255/var(--tw-bg-opacity,1));color:rgb(30 58 138/var(--tw-text-opacity,1))}.tw-alert-danger,.tw-alert-info{--tw-border-opacity:1;--tw-bg-opacity:1;padding:.75rem 1rem;--tw-text-opacity:1;--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.tw-alert-danger{border-radius:.5rem;border-width:1px;border-color:rgb(254 205 211/var(--tw-border-opacity,1));background-color:rgb(255 241 242/var(--tw-bg-opacity,1));font-size:.875rem;line-height:1.25rem;font-weight:500;color:rgb(159 18 57/var(--tw-text-opacity,1))}.tw-alert-danger,.view-ui-table-wrap{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.view-ui-table-wrap{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color)}.view-ui-table{min-width:100%}.view-ui-table>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px*var(--tw-divide-y-reverse));--tw-divide-opacity:1;border-color:rgb(226 232 240/var(--tw-divide-opacity,1))}.view-ui-table{font-size:.875rem;line-height:1.25rem}.view-ui-table thead th{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:.75rem 1rem;text-align:left;font-size:.75rem;line-height:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.view-ui-table tbody td{padding:1rem;vertical-align:top;--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.view-ui-table tbody tr{border-top-width:1px;--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1))}.view-ui-row-actions{display:flex;flex-wrap:wrap;gap:.5rem}.view-ui-card-grid{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);display:grid;gap:1rem}@media (min-width:768px){.view-ui-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1280px){.view-ui-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.view-ui-card{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding:1.25rem;--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.view-ui-card,.view-ui-card:hover{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.view-ui-card:hover{--tw-translate-y:-0.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow:0 18px 50px rgba(15,23,42,.1);--tw-shadow-colored:0 18px 50px var(--tw-shadow-color)}.view-ui-card--coupon{padding:1.25rem}.view-ui-card--coupon,.view-ui-card--course{border-radius:1.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.view-ui-card--course{overflow:hidden;padding:0}.view-ui-card__cover{min-height:180px;--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1));background-size:cover;background-position:50%;background-repeat:no-repeat}.view-ui-card__body{display:flex;flex-direction:column;gap:.75rem;padding:1.25rem}.view-ui-pill{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;border-width:1px;--tw-border-opacity:1;border-color:rgb(219 234 254/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1));padding:.25rem .75rem;font-size:.75rem;line-height:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.view-ui-empty{border-radius:.5rem;border-width:1px;border-style:dashed;--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:3rem 1.5rem;text-align:center;color:rgb(100 116 139/var(--tw-text-opacity,1))}.view-ui-empty,.view-ui-field-label{font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1}.view-ui-field-label{margin-bottom:.5rem;display:block;font-weight:600;color:rgb(51 65 85/var(--tw-text-opacity,1))}.view-ui-modal .modal-content{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-shadow:0 18px 50px rgba(15,23,42,.1);--tw-shadow-colored:0 18px 50px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.view-ui-modal .modal-header{display:flex;align-items:center;justify-content:space-between;border-top-left-radius:.5rem;border-top-right-radius:.5rem;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:1rem 1.25rem}.view-ui-modal .modal-title{font-size:1.125rem;line-height:1.75rem;font-weight:600;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.view-ui-modal .modal-body{padding:1.25rem}.view-ui-modal .modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem;border-top-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:1rem 1.25rem}.view-ui-modal .close{display:flex;height:2rem;width:2rem;align-items:center;justify-content:center;border-radius:9999px;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1));opacity:1;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.view-ui-modal .close:hover{--tw-bg-opacity:1;background-color:rgb(226 232 240/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.view-ui-inline-link{font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1));text-decoration-line:none}.view-ui-inline-link:hover{--tw-text-opacity:1;color:rgb(45 127 249/var(--tw-text-opacity,1))}.content-pd,.contents_start,.view_course_details,.view_portalsetting,.viewcoupon{padding:1rem}@media (min-width:768px){.content-pd,.contents_start,.view_course_details,.view_portalsetting,.viewcoupon{padding:1.5rem}}.main_top_headers,.page-heading{margin-bottom:1.5rem;display:flex;flex-direction:column;gap:1rem;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding:1.25rem;--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}@media (min-width:768px){.main_top_headers,.page-heading{flex-direction:row;align-items:flex-start;justify-content:space-between;padding:1.5rem}}.main_top_headers h1,.page-heading h4,.page-title,.table-title{margin:0;font-size:1.5rem;line-height:2rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.breadcrumb,.new_breadcrames{margin-top:.75rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;background-color:transparent;padding:0;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.breadcrumb li,.new_breadcrames li{list-style-type:none}.breadcrumb a,.new_breadcrames a{--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1));text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.breadcrumb a:hover,.new_breadcrames a:hover{--tw-text-opacity:1;color:rgb(45 127 249/var(--tw-text-opacity,1))}.breadcrumb li.active,.breadcrumb-item.active,.new_breadcrames li.active a{--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.card_new,.createNewTick,.learnersDivs,.portlet.\!box,.portlet.box,.table-outer,.table_new_style{float:none!important;overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.card_header_new,.portlet-title,.ticketHeader{display:flex;flex-direction:column;gap:.75rem;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:1rem 1.25rem}@media (min-width:768px){.card_header_new,.portlet-title,.ticketHeader{flex-direction:row;align-items:center;justify-content:space-between}}.card_header_new h4,.portlet-title .caption{font-size:1.125rem;line-height:1.75rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.card_header_new>div:last-child,.portlet-title .actions{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.card_body_new,.form-btm,.portlet-body,.tickChatHeader,.tickInfo,.tickStatus{padding:1.25rem}@media (min-width:768px){.card_body_new,.form-btm,.portlet-body,.tickChatHeader,.tickInfo,.tickStatus{padding:1.5rem}}.tab_new_style{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.tabs_list{display:flex;flex-wrap:wrap;gap:.5rem;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));padding:1rem}.tabs_list li{list-style-type:none}.tabs_list li a{display:inline-flex;align-items:center;gap:.5rem;border-radius:.375rem;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1));text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.tabs_list li a:hover{background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.tabs_list li a.active,.tabs_list li a:hover,.tabs_list li.active a{--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.tabs_list li a.active,.tabs_list li.active a{background-color:rgb(239 246 255/var(--tw-bg-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(191 219 254/var(--tw-ring-opacity,1))}.coupons-table,.rgMasterTable,.table{min-width:100%}.coupons-table>:not([hidden])~:not([hidden]),.rgMasterTable>:not([hidden])~:not([hidden]),.table>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px*var(--tw-divide-y-reverse));--tw-divide-opacity:1;border-color:rgb(226 232 240/var(--tw-divide-opacity,1))}.coupons-table,.rgMasterTable,.table{font-size:.875rem;line-height:1.25rem}.coupons-table thead th,.rgHeader,.rgMasterTable thead th,.table thead th{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:.75rem 1rem;text-align:left;font-size:.75rem;line-height:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.coupons-table tbody td,.rgMasterTable tbody td,.rgRow td,.table tbody td{padding:1rem;vertical-align:top;--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.coupons-table tbody tr,.rgMasterTable tbody tr,.table tbody tr{border-top-width:1px;--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1))}.btn_custom_red{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.btn_custom_red:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.btn_custom_red{--tw-bg-opacity:1;background-color:rgb(31 111 232/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.btn_custom_red:hover{--tw-bg-opacity:1;background-color:rgb(27 91 204/var(--tw-bg-opacity,1))}.btn_custom_red_outline,.btn_custom_silver{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.btn_custom_red_outline:focus,.btn_custom_silver:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.btn_custom_red_outline,.btn_custom_silver{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.btn_custom_red_outline:hover,.btn_custom_silver:hover{--tw-border-opacity:1;border-color:rgb(147 197 253/var(--tw-border-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.btn_small{padding:.5rem .75rem!important;font-size:.75rem;line-height:1rem}.btn_large{padding:.75rem 1.5rem!important;font-size:1rem!important;line-height:1.5rem!important}.coupon-box{height:100%;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding:1rem;--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.coupon-box,.coupon-box:hover{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.coupon-box:hover{--tw-translate-y:-0.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow:0 18px 50px rgba(15,23,42,.1);--tw-shadow-colored:0 18px 50px var(--tw-shadow-color)}.coupon-box-inner,.newcoupon-box-inner{display:flex;height:100%;flex-direction:column;justify-content:space-between;gap:.75rem;border-radius:.375rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:1rem}.c-code{display:inline-flex;align-self:flex-start;border-radius:9999px;--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1));padding:.25rem .75rem;font-size:.75rem;line-height:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.18em;--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.employee_main,.filter_for_employee .portlet-body,.table-responsive{overflow-x:auto}.form-control,.input-group>.form-control,.oi-select-container{border-radius:.5rem;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);transition:border-color .15s ease,box-shadow .15s ease}.form-control:focus,.oi-select-container:focus{border-color:rgb(var(--mv-focus));box-shadow:0 0 0 2px rgb(var(--mv-focus)/.2);outline:none}.alert-danger,.alert-default,.alert-warning{border-radius:.5rem;border-width:1px;padding:.75rem 1rem;--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.alert-warning{border-color:rgb(253 230 138/var(--tw-border-opacity,1));background-color:rgb(255 251 235/var(--tw-bg-opacity,1));color:rgb(120 53 15/var(--tw-text-opacity,1))}.alert-danger,.alert-warning{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-text-opacity:1}.alert-danger{border-color:rgb(254 205 211/var(--tw-border-opacity,1));background-color:rgb(255 241 242/var(--tw-bg-opacity,1));color:rgb(159 18 57/var(--tw-text-opacity,1))}.alert-default{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.course-wrap{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);margin-top:1.5rem;display:grid;gap:1.5rem}@media (min-width:1024px){.course-wrap{grid-template-columns:repeat(12,minmax(0,1fr))}}.course-wrap>.col-md-3,.course-wrap>.col-md-9{width:100%!important}@media (min-width:1024px){.course-wrap>.col-md-3{grid-column:span 4/span 4}}@media (min-width:1280px){.course-wrap>.col-md-3{grid-column:span 3/span 3}}@media (min-width:1024px){.course-wrap>.col-md-9{grid-column:span 8/span 8}}@media (min-width:1280px){.course-wrap>.col-md-9{grid-column:span 9/span 9}}.course-description,.course-green,.course-head,.course-views,.uNote,.uNoteText,.uNoteTextTitle{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.course-green{overflow:hidden;padding:0}.img-course{height:auto;width:100%;border-top-left-radius:.5rem;border-top-right-radius:.5rem;-o-object-fit:cover;object-fit:cover}.course-head{border-radius:0;border-width:0 0 1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));padding:1.25rem}.course-head h1,.course-head h4,.course_category,.course_title{margin:0}.course_title{font-size:1.5rem;line-height:2rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.course_category{font-size:.875rem;line-height:1.25rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.course_description{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding:1.25rem;font-size:.875rem;line-height:1.75rem;--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.course-views,.create-date{margin-top:1rem;padding:1rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.view-no{display:block;font-size:1.875rem;line-height:2.25rem;font-weight:700;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.tab-content{padding:1.25rem}@media (min-width:768px){.tab-content{padding:1.5rem}}.empList{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);display:grid;gap:1rem}@media (min-width:768px){.empList{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1280px){.empList{grid-template-columns:repeat(3,minmax(0,1fr))}}.empCard,.empCardOut .empCard{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}.empCard:hover,.empCardOut .empCard:hover{--tw-translate-y:-0.125rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow:0 18px 50px rgba(15,23,42,.1);--tw-shadow-colored:0 18px 50px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.rowWrapper{padding:1% 3%}.inLearners{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem}.LTitle{font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.Lvalue{font-size:1.5rem;line-height:2rem;font-weight:600;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.empCardHead{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;background-image:linear-gradient(135deg,#5b38f6,#734cf8 35%,#3f65ff);padding:1.25rem;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.bodyP1,.bodyP2,.empCardFooter{padding:1.25rem}.empName{font-size:1.25rem;line-height:1.75rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.empType,.part2Title{font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.empStatusa{--tw-bg-opacity:1;background-color:rgb(236 253 245/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(4 120 87/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(167 243 208/var(--tw-ring-opacity,1))}.empStatusa,.empStatusi{display:inline-flex;align-items:center;gap:.5rem;border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;line-height:1rem;font-weight:600;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.empStatusi{--tw-bg-opacity:1;background-color:rgb(255 251 235/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(180 83 9/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(253 230 138/var(--tw-ring-opacity,1))}.statusDotg,.statusDoto{display:inline-block;height:.5rem;width:.5rem;border-radius:9999px}.statusDotg{--tw-bg-opacity:1;background-color:rgb(16 185 129/var(--tw-bg-opacity,1))}.statusDoto{--tw-bg-opacity:1;background-color:rgb(245 158 11/var(--tw-bg-opacity,1))}.TeamGrp{display:inline-flex;border-radius:9999px;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:.25rem .75rem;font-size:.75rem;line-height:1rem;font-weight:600;color:rgb(100 116 139/var(--tw-text-opacity,1))}.TeamGrp,.bp2Inn{align-items:center;gap:.5rem;--tw-text-opacity:1}.bp2Inn{display:flex;padding-top:.25rem;padding-bottom:.25rem;font-size:.875rem;line-height:1.25rem;color:rgb(51 65 85/var(--tw-text-opacity,1))}.bp2Inn i{--tw-text-opacity:1;color:rgb(31 111 232/var(--tw-text-opacity,1))}.bp2Inn span{word-break:break-all;font-size:.875rem;line-height:1rem;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.\!grid,.grid{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.card-actions-menu{display:flex;align-items:center;gap:.625rem}.card-actions-menu i{margin:0;display:flex;height:1.25rem;width:1.25rem;cursor:pointer;align-items:center;justify-content:center;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.card-actions-menu i:hover{--tw-text-opacity:1;color:rgb(31 111 232/var(--tw-text-opacity,1))}.offcanvas{position:fixed;top:0;z-index:9999;height:100%;--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);transition-property:all;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1);right:-30%;width:30%}.offcanvas.show{right:0}.offcanvas.\!show{right:0!important}.offcanvas-header{margin-bottom:1rem;font-weight:700}.view_portalsetting .tab-content,.view_portalsetting .table_new_style{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.view_portalsetting .tab-pane,.view_portalsetting .table_new_style{padding:1.25rem}@media (min-width:768px){.view_portalsetting .tab-pane{padding:1.5rem}}.ticketHeader{margin-bottom:0;border-top-left-radius:.5rem;border-top-right-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));background-image:radial-gradient(circle at top left,rgba(91,56,246,.22),transparent 38%),radial-gradient(circle at top right,rgba(19,184,166,.18),transparent 32%),linear-gradient(180deg,hsla(0,0%,100%,.98),rgba(248,250,252,.98));padding:1.25rem;--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.titleDivfooter p{font-size:1.5rem;line-height:2rem;font-weight:700;letter-spacing:-.025em;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.tickNo{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1));padding:.75rem 1.25rem;font-weight:600;color:rgb(27 91 204/var(--tw-text-opacity,1))}.sendersName,.tickDetils,.tickNo{font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1}.sendersName,.tickDetils{color:rgb(51 65 85/var(--tw-text-opacity,1))}.ResmodalClose{display:flex;height:2rem;width:2rem;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;--tw-border-opacity:1;border-color:rgb(2 6 23/var(--tw-border-opacity,1));font-size:1.25rem;line-height:1.75rem}.instr-view-course .course_features{display:flex;flex-wrap:wrap;gap:.75rem}#ckf-modal{z-index:10101!important}.ckf-file-preview-root{z-index:10110!important}.remove-left{padding-left:15px!important}.remove-right{padding-right:15px!important}.pSkills{display:inline-block;width:100%;overflow-wrap:break-word;text-align:left;font-size:.875rem;line-height:1.25rem;line-height:18px;--tw-text-opacity:1;color:rgb(148 163 184/var(--tw-text-opacity,1));background:transparent!important;white-space:normal}.table>tbody>tr>td{vertical-align:middle!important}.wrs_editor .wrs_tickContainer{display:none!important}.modal-lg{width:900px!important}.modal-body{overflow:hidden}.pop-cname{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(31 111 232/var(--tw-bg-opacity,1));padding:.625rem .75rem;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.pop-cname h1{margin:0;font-size:1.125rem;font-weight:400;line-height:1.5rem}.bg-course,.designc-popup{overflow:hidden;border-width:1px;--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(241 245 249/var(--tw-bg-opacity,1))}.radio-one{border-bottom-width:1px;border-color:rgb(203 213 225/var(--tw-border-opacity,1));padding:.625rem}.c-middle,.radio-one{--tw-border-opacity:1}.c-middle{overflow-y:auto;border-left-width:1px;border-right-width:1px;border-color:rgb(203 213 225/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding:1rem;height:570px;padding-bottom:0}.c-right h3{margin:0;padding:.625rem;font-size:1.125rem;line-height:1.75rem;font-weight:400;text-transform:uppercase}.uploaded-img{margin:0;list-style-type:none;padding:0}.uploaded-img li{margin:.625rem;border-radius:.375rem;border-width:3px;--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.uploaded-img li img{width:100%}.validity-popup{border-width:1px;--tw-border-opacity:1;border-color:rgb(203 213 225/var(--tw-border-opacity,1))}.v-main{padding:1rem}.v-footer{margin-top:1rem;overflow:hidden;padding-top:1rem}.nav-tabs{display:flex;flex-wrap:wrap;gap:.25rem;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));padding:.75rem 1rem 0;background:transparent}.nav-tabs>li{margin-bottom:-1px;list-style-type:none}.nav-tabs>li>a{display:inline-flex;align-items:center;gap:.5rem;border-top-left-radius:.375rem;border-top-right-radius:.375rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1));text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.nav-tabs>li>a:hover{--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover,.nav-tabs>li>a.active{border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-border-opacity:1;border-bottom-color:rgb(255 255 255/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.nav-tabs.customize-tab,.nav-tabs.customize-tab-font,.nav-tabs.tab-ul-margin-bottom-none{gap:.25rem}.tab-content>.tab-pane{padding:1.25rem}@media (min-width:768px){.tab-content>.tab-pane{padding:1.5rem}}.mv-focus-ring:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-offset-width:2px}.mv-focus-ring{--tw-ring-color:rgb(var(--mv-focus)/0.7);--tw-ring-offset-color:rgb(var(--mv-bg))}.mv-input{width:100%;border-radius:.5rem;border-width:1px;padding:.625rem .75rem;font-size:15px;line-height:1.25rem;outline:2px solid transparent;outline-offset:2px;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background-color:rgb(var(--mv-surface));color:rgb(var(--mv-text));border-color:rgb(var(--mv-border))}.mv-input::-moz-placeholder{color:rgb(var(--mv-text-soft))}.mv-input::placeholder{color:rgb(var(--mv-text-soft))}.mv-input:focus{border-color:rgb(var(--mv-focus));box-shadow:0 0 0 2px rgb(var(--mv-focus)/.2)}.mv-input:disabled{background-color:rgb(var(--mv-surface-2));color:rgb(var(--mv-text-soft));cursor:not-allowed}.mv-chip{gap:.375rem;border-radius:9999px;font-weight:500}.btn,.mv-chip{display:inline-flex;align-items:center}.btn{justify-content:center;gap:.5rem;border-radius:.5rem;border-width:1px;border-color:transparent;padding:.625rem 1rem;font-size:.875rem;line-height:1.25rem;font-weight:600;text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;min-height:2.75rem}.btn:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-color:rgba(45,127,249,.7);--tw-ring-offset-width:2px}.btn-primary{--tw-bg-opacity:1;background-color:rgb(31 111 232/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.btn-primary:hover{--tw-bg-opacity:1;background-color:rgb(27 91 204/var(--tw-bg-opacity,1))}.btn-default,.btn-secondary{--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.btn-default:hover,.btn-secondary:hover{--tw-border-opacity:1;border-color:rgb(147 197 253/var(--tw-border-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.btn-danger{--tw-bg-opacity:1;background-color:rgb(244 63 94/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.btn-danger:hover{--tw-bg-opacity:1;background-color:rgb(225 29 72/var(--tw-bg-opacity,1))}.btn-warning{--tw-bg-opacity:1;background-color:rgb(245 158 11/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.btn-warning:hover{--tw-bg-opacity:1;background-color:rgb(217 119 6/var(--tw-bg-opacity,1))}.btn-success{--tw-bg-opacity:1;background-color:rgb(16 185 129/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.btn-success:hover{--tw-bg-opacity:1;background-color:rgb(5 150 105/var(--tw-bg-opacity,1))}.btn-info{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.btn-info:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity,1))}.btn-sm{min-height:0!important;padding:.375rem .75rem!important;font-size:.75rem!important;line-height:1rem!important}.btn-lg{padding:.75rem 1.5rem!important;font-size:1rem!important;line-height:1.5rem!important}.text-muted{color:rgb(var(--mv-text-soft))}.help-block{margin-top:.25rem;font-size:.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgb(100 116 139/var(--tw-text-opacity,1))}.input-sm{padding-top:.375rem!important;padding-bottom:.375rem!important;font-size:.75rem!important;line-height:1rem!important}.input-lg{padding-top:.75rem!important;padding-bottom:.75rem!important;font-size:1rem!important;line-height:1.5rem!important}.label{display:inline-flex;align-items:center;border-radius:9999px;padding:.125rem .625rem;font-size:.75rem;line-height:1rem;font-weight:600}.label-default,.label-primary{--tw-bg-opacity:1;background-color:rgb(219 234 254/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(27 76 166/var(--tw-text-opacity,1))}.label-success{--tw-bg-opacity:1;background-color:rgb(236 253 245/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(6 95 70/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(167 243 208/var(--tw-ring-opacity,1))}.label-info,.label-success{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.label-info{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(30 64 175/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(191 219 254/var(--tw-ring-opacity,1))}.label-warning{--tw-bg-opacity:1;background-color:rgb(255 251 235/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(146 64 14/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(253 230 138/var(--tw-ring-opacity,1))}.label-danger,.label-important,.label-warning{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.label-danger,.label-important{--tw-bg-opacity:1;background-color:rgb(255 241 242/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(159 18 57/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(254 205 211/var(--tw-ring-opacity,1))}.label-blue{--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1));--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);--tw-ring-inset:inset;--tw-ring-opacity:1;--tw-ring-color:rgb(191 219 254/var(--tw-ring-opacity,1))}.badge{display:inline-flex;min-width:1.25rem;align-items:center;justify-content:center;border-radius:9999px;--tw-bg-opacity:1;background-color:rgb(31 111 232/var(--tw-bg-opacity,1));padding:.125rem .375rem;font-size:.75rem;line-height:1rem;font-weight:700;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.panel{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.panel-heading{border-top-left-radius:.5rem;border-top-right-radius:.5rem;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:1rem 1.25rem}.panel-title{font-size:1rem;line-height:1.5rem;font-weight:600;--tw-text-opacity:1;color:rgb(15 23 42/var(--tw-text-opacity,1))}.panel-body{padding:1.25rem}.panel-footer{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem;border-top-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:.75rem 1.25rem}.panel-primary>.panel-heading{--tw-border-opacity:1;border-color:rgb(27 91 204/var(--tw-border-opacity,1));background-color:rgb(31 111 232/var(--tw-bg-opacity,1))}.panel-primary>.panel-heading,.panel-success>.panel-heading{--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.panel-success>.panel-heading{background-color:rgb(16 185 129/var(--tw-bg-opacity,1))}.panel-info>.panel-heading{background-color:rgb(59 130 246/var(--tw-bg-opacity,1))}.panel-info>.panel-heading,.panel-warning>.panel-heading{--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.panel-warning>.panel-heading{background-color:rgb(245 158 11/var(--tw-bg-opacity,1))}.panel-danger>.panel-heading{--tw-bg-opacity:1;background-color:rgb(244 63 94/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.well{border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:1.25rem;--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.well-sm{padding:.75rem!important}.well-lg{padding:2rem!important}.pagination{display:inline-flex;align-items:center;gap:.25rem}.pagination>li>a,.pagination>li>span{display:flex;height:2.25rem;min-width:2.25rem;align-items:center;justify-content:center;border-radius:.375rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));padding-left:.5rem;padding-right:.5rem;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1));text-decoration-line:none;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pagination>li>a:hover,.pagination>li>span:hover{--tw-border-opacity:1;border-color:rgb(147 197 253/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(239 246 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(27 91 204/var(--tw-text-opacity,1))}.pagination>li.active>a,.pagination>li.active>span{--tw-border-opacity:1;border-color:rgb(31 111 232/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(31 111 232/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.pagination>li.active>a:hover,.pagination>li.active>span:hover{--tw-bg-opacity:1;background-color:rgb(27 91 204/var(--tw-bg-opacity,1))}.pagination>li.disabled>a,.pagination>li.disabled>span{pointer-events:none;--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(203 213 225/var(--tw-text-opacity,1))}.mv-card{overflow:hidden;border-radius:.5rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-shadow:0 10px 30px rgba(15,23,42,.08);--tw-shadow-colored:0 10px 30px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.mv-card-header{display:flex;align-items:center;justify-content:space-between;border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(226 232 240/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248 250 252/var(--tw-bg-opacity,1));padding:.875rem 1.25rem}.mv-card--primary .mv-card-header{border-color:rgb(27 91 204/var(--tw-border-opacity,1));background-color:rgb(31 111 232/var(--tw-bg-opacity,1))}.mv-card--primary .mv-card-header,.mv-card--success .mv-card-header{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.mv-card--success .mv-card-header{border-color:rgb(5 150 105/var(--tw-border-opacity,1));background-color:rgb(16 185 129/var(--tw-bg-opacity,1))}.mv-card--warning .mv-card-header{border-color:rgb(217 119 6/var(--tw-border-opacity,1));background-color:rgb(245 158 11/var(--tw-bg-opacity,1))}.mv-card--danger .mv-card-header,.mv-card--warning .mv-card-header{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.mv-card--danger .mv-card-header{border-color:rgb(225 29 72/var(--tw-border-opacity,1));background-color:rgb(244 63 94/var(--tw-bg-opacity,1))}.mv-card--purple .mv-card-header{background-color:#5b38f6;border-color:#4a2de5;--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.mv-card--neutral .mv-card-header{--tw-border-opacity:1;border-color:rgb(51 65 85/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(71 85 105/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.mv-card-caption{display:flex;align-items:center;gap:.5rem;font-size:.875rem;line-height:1.25rem;font-weight:600}.mv-card-caption i,.mv-card-caption svg{opacity:.8}.mv-card-tools{display:flex;align-items:center;gap:.375rem}.mv-card-tools a,.mv-card-tools button{display:flex;height:1.75rem;width:1.75rem;align-items:center;justify-content:center;border-radius:.25rem;color:inherit;opacity:.7;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.mv-card-tools a:hover,.mv-card-tools button:hover{opacity:1}.mv-card-tools a,.mv-card-tools button{background:hsla(0,0%,100%,.15)}.mv-card-body{padding:1.25rem}.mv-form{display:flex;flex-direction:column}.mv-form-row{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(241 245 249/var(--tw-border-opacity,1));padding-top:.75rem;padding-bottom:.75rem}.mv-form-row:last-child{border-bottom-width:0}.mv-form-row{display:grid;grid-template-columns:11rem 1fr;gap:.375rem 1rem;align-items:start}.mv-form-label{padding-top:.5rem;text-align:right;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity:1;color:rgb(51 65 85/var(--tw-text-opacity,1))}.mv-form-field{min-width:0}.mv-form-offset{grid-column:2}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.visible{visibility:visible}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.bottom-5{bottom:1.25rem}.order-2{order:2}.float-right{float:right}.float-left{float:left}.m-0{margin:0}.m-48{margin:12rem}.m-auto{margin:auto}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-top:.5rem;margin-bottom:.5rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-5{margin-top:1.25rem;margin-bottom:1.25rem}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.me-2{margin-inline-end:.5rem}.ml-1{margin-left:.25rem}.mr-1{margin-right:.25rem}.mr-2{margin-right:.5rem}.mr-auto{margin-right:auto}.ms-auto{margin-inline-start:auto}.mt-0{margin-top:0}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-8{margin-top:2rem}.line-clamp-2{-webkit-line-clamp:2}.line-clamp-2,.line-clamp-3{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}.line-clamp-3{-webkit-line-clamp:3}.line-clamp-4{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.table-row{display:table-row}.\!grid{display:grid!important}.grid{display:grid}.contents{display:contents}.hidden{display:none}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-2{height:.5rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-9{height:2.25rem}.h-\[18px\]{height:18px}.h-screen{height:100vh}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-2{width:.5rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-9{width:2.25rem}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\[18px\]{min-width:18px}.max-w-7xl{max-width:80rem}.flex-1{flex:1 1 0%}.flex-shrink{flex-shrink:1}.flex-shrink-0{flex-shrink:0}.flex-grow{flex-grow:1}.border-collapse{border-collapse:collapse}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.animate-fade-in{animation:fadeIn .2s ease-out}.animate-shimmer{animation:shimmer 2s linear infinite}.animate-slide-up{animation:slideUp .3s ease-out}.resize{resize:both}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-10{gap:2.5rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235/var(--tw-border-opacity,1))}.border-orange-200{--tw-border-opacity:1;border-color:rgb(254 215 170/var(--tw-border-opacity,1))}.border-purple-200{--tw-border-opacity:1;border-color:rgb(233 213 255/var(--tw-border-opacity,1))}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-blue-600{--tw-bg-opacity:1;background-color:rgb(37 99 235/var(--tw-bg-opacity,1))}.bg-cyan-600{--tw-bg-opacity:1;background-color:rgb(8 145 178/var(--tw-bg-opacity,1))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.bg-green-500{--tw-bg-opacity:1;background-color:rgb(34 197 94/var(--tw-bg-opacity,1))}.bg-indigo-500{--tw-bg-opacity:1;background-color:rgb(99 102 241/var(--tw-bg-opacity,1))}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity,1))}.bg-orange-50{--tw-bg-opacity:1;background-color:rgb(255 247 237/var(--tw-bg-opacity,1))}.bg-orange-500{--tw-bg-opacity:1;background-color:rgb(249 115 22/var(--tw-bg-opacity,1))}.bg-purple-100{--tw-bg-opacity:1;background-color:rgb(243 232 255/var(--tw-bg-opacity,1))}.bg-purple-600{--tw-bg-opacity:1;background-color:rgb(147 51 234/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/10{background-color:hsla(0,0%,100%,.1)}.bg-white\/5{background-color:hsla(0,0%,100%,.05)}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.from-purple-500{--tw-gradient-from:#a855f7 var(--tw-gradient-from-position);--tw-gradient-to:rgba(168,85,247,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.to-indigo-500{--tw-gradient-to:#6366f1 var(--tw-gradient-to-position)}.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-0{padding-bottom:0}.pb-5{padding-bottom:1.25rem}.pl-0{padding-left:0}.pl-2{padding-left:.5rem}.pr-20{padding-right:5rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.ps-3{padding-inline-start:.75rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-3{padding-top:.75rem}.pt-5{padding-top:1.25rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-start{text-align:start}.text-end{text-align:end}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-\[11px\]{font-size:11px}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-extrabold{font-weight:800}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.leading-\[18px\]{line-height:18px}.leading-tight{line-height:1.25}.tracking-tight{letter-spacing:-.025em}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity,1))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity,1))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity,1))}.text-green-700{--tw-text-opacity:1;color:rgb(21 128 61/var(--tw-text-opacity,1))}.text-orange-700{--tw-text-opacity:1;color:rgb(194 65 12/var(--tw-text-opacity,1))}.text-purple-700{--tw-text-opacity:1;color:rgb(126 34 206/var(--tw-text-opacity,1))}.text-red-700{--tw-text-opacity:1;color:rgb(185 28 28/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.line-through{text-decoration-line:line-through}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-none{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-none{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.blur{--tw-blur:blur(8px)}.blur,.grayscale{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.grayscale{--tw-grayscale:grayscale(100%)}.invert{--tw-invert:invert(100%)}.invert,.sepia{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.sepia{--tw-sepia:sepia(100%)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-filter{-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.animate-fade-in{animation:fadeIn .2s ease-in-out}.animate-slide-up{animation:slideUp .3s ease-out}.animate-shimmer{animation:shimmer 2s infinite}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.loading-shimmer{background:linear-gradient(90deg,rgb(var(--mv-surface-2)) 0,rgb(var(--mv-surface-3)) 50%,rgb(var(--mv-surface-2)) 100%);background-size:1000px 100%;animation:shimmer 2s infinite}.line-clamp-2{-webkit-line-clamp:2}.line-clamp-2,.line-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-3{-webkit-line-clamp:3}.checkerboard-bg{background-image:linear-gradient(45deg,rgb(var(--mv-surface-3)/.6) 25%,transparent 25%),linear-gradient(-45deg,rgb(var(--mv-surface-3)/.6) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgb(var(--mv-surface-3)/.6) 75%),linear-gradient(-45deg,transparent 75%,rgb(var(--mv-surface-3)/.6) 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}@media (max-width:640px){.mv-form-row{grid-template-columns:1fr;gap:.25rem}.mv-form-label{text-align:left;padding-top:0}.mv-form-offset{grid-column:1}}.col-xs-1{width:8.33333%}.col-xs-2{width:16.66667%}.col-xs-3{width:25%}.col-xs-4{width:33.33333%}.col-xs-5{width:41.66667%}.col-xs-6{width:50%}.col-xs-7{width:58.33333%}.col-xs-8{width:66.66667%}.col-xs-9{width:75%}.col-xs-10{width:83.33333%}.col-xs-11{width:91.66667%}.col-xs-12{width:100%}.col-xs-offset-0{margin-left:0}.col-xs-offset-1{margin-left:8.33333%}.col-xs-offset-2{margin-left:16.66667%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-4{margin-left:33.33333%}.col-xs-offset-5{margin-left:41.66667%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-7{margin-left:58.33333%}.col-xs-offset-8{margin-left:66.66667%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-10{margin-left:83.33333%}.col-xs-offset-11{margin-left:91.66667%}.col-xs-offset-12{margin-left:100%}@media (min-width:768px){.col-sm-1{width:8.33333%}.col-sm-2{width:16.66667%}.col-sm-3{width:25%}.col-sm-4{width:33.33333%}.col-sm-5{width:41.66667%}.col-sm-6{width:50%}.col-sm-7{width:58.33333%}.col-sm-8{width:66.66667%}.col-sm-9{width:75%}.col-sm-10{width:83.33333%}.col-sm-11{width:91.66667%}.col-sm-12{width:100%}.col-sm-offset-0{margin-left:0}.col-sm-offset-1{margin-left:8.33333%}.col-sm-offset-2{margin-left:16.66667%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333%}.col-sm-offset-5{margin-left:41.66667%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-7{margin-left:58.33333%}.col-sm-offset-8{margin-left:66.66667%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-10{margin-left:83.33333%}.col-sm-offset-11{margin-left:91.66667%}.col-sm-offset-12{margin-left:100%}}@media (min-width:992px){.col-md-1{width:8.33333%}.col-md-2{width:16.66667%}.col-md-3{width:25%}.col-md-4{width:33.33333%}.col-md-5{width:41.66667%}.col-md-6{width:50%}.col-md-7{width:58.33333%}.col-md-8{width:66.66667%}.col-md-9{width:75%}.col-md-10{width:83.33333%}.col-md-11{width:91.66667%}.col-md-12{width:100%}.col-md-offset-0{margin-left:0}.col-md-offset-1{margin-left:8.33333%}.col-md-offset-2{margin-left:16.66667%}.col-md-offset-3{margin-left:25%}.col-md-offset-4{margin-left:33.33333%}.col-md-offset-5{margin-left:41.66667%}.col-md-offset-6{margin-left:50%}.col-md-offset-7{margin-left:58.33333%}.col-md-offset-8{margin-left:66.66667%}.col-md-offset-9{margin-left:75%}.col-md-offset-10{margin-left:83.33333%}.col-md-offset-11{margin-left:91.66667%}.col-md-offset-12{margin-left:100%}}@media (min-width:1200px){.col-lg-1{width:8.33333%}.col-lg-2{width:16.66667%}.col-lg-3{width:25%}.col-lg-4{width:33.33333%}.col-lg-5{width:41.66667%}.col-lg-6{width:50%}.col-lg-7{width:58.33333%}.col-lg-8{width:66.66667%}.col-lg-9{width:75%}.col-lg-10{width:83.33333%}.col-lg-11{width:91.66667%}.col-lg-12{width:100%}.col-lg-offset-0{margin-left:0}.col-lg-offset-1{margin-left:8.33333%}.col-lg-offset-2{margin-left:16.66667%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-4{margin-left:33.33333%}.col-lg-offset-5{margin-left:41.66667%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-7{margin-left:58.33333%}.col-lg-offset-8{margin-left:66.66667%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-10{margin-left:83.33333%}.col-lg-offset-11{margin-left:91.66667%}.col-lg-offset-12{margin-left:100%}}[class*=col-lg-],[class*=col-md-],[class*=col-sm-],[class*=col-xs-]{box-sizing:border-box;padding-left:15px;padding-right:15px;position:relative;min-height:1px}.row{display:flex!important;flex-wrap:wrap;margin-left:-15px;margin-right:-15px}.row:after,.row:before{display:none!important}.row>[class*=col-]{float:none!important;min-width:0}.pull-right{float:right!important}.pull-left{float:left!important}.no-chat .chat-window{display:none!important}.userSettingsMenu{width:225px}.supportTickets{display:flex;align-items:center;justify-content:center;position:relative;top:-10px;font-size:24px}.supportTickets:hover a{color:initial!important}.page-sidebar-closed .page-sidebar-menu>li>.menu-report{display:none!important;max-height:200px;overflow-y:auto!important;pointer-events:all;touch-action:auto}.alertnotviewed{background:#f0f0d0!important}.last\:border-b-0:last-child{border-bottom-width:0}.hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}.hover\:bg-white\/10:hover{background-color:hsla(0,0%,100%,.1)}@media (min-width:640px){.sm\:flex{display:flex}}@media (min-width:768px){.md\:block{display:block}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1024px){.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:flex-row{flex-direction:row}.lg\:items-start{align-items:flex-start}.lg\:items-end{align-items:flex-end}.lg\:items-center{align-items:center}.lg\:justify-between{justify-content:space-between}}@media (min-width:1280px){.xl\:col-span-1{grid-column:span 1/span 1}.xl\:col-span-2{grid-column:span 2/span 2}.xl\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.xl\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* ============================================================
   Extracted component classes — previously inline in views
   ============================================================ */

/* mv-question-* — ViewQuestionsForCategoryPage */
.inutanswer .list-unstyled{display:flex;margin:20px auto}
@media(max-width:600px){.inutanswer .list-unstyled{flex-wrap:wrap}.inutanswer{max-width:100%;overflow-x:auto}.footerquestions .row{display:flex;flex-wrap:wrap}}
#old_maventra{display:none !important}
.catque{display:flex}
.questiontypeineer{width:100%;display:flex;flex-direction:column}
.mapCmodal{margin-top:100px}

/* mv-hotspot — shared across question/response pages */
.hotspotCreator-arrange{width:100% !important}

/* mv-portal-editor — portal settings editor overrides */
#ckf-modal{z-index:10101 !important}
.ckf-file-preview-root{z-index:10110 !important}
.remove-left{padding-left:15px !important}
.remove-right{padding-right:15px !important}
.ck-editor__editable:not(.ck-editor__nested-editable){min-height:200px !important}
.wrs_editor .wrs_tickContainer{display:none !important}

/* mv-course-form — course details form fixes */
select,textarea,input[type="text"],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],input[type="tel"],input[type="color"],.uneditable-input{margin-bottom:0 !important}
.dn-timepicker-popup{max-height:180px;overflow-y:scroll}
.popupTitle{margin:0 0 10px;font-size:17px}
.portlet>.mv-card-header>.tools,.portlet>.mv-card-header>.actions,.portlet>.mv-card-header>.actions>.btn.btn-sm{margin:0}

/* mv-badge-fix — response page badge text color */
.badge{color:#fff !important}

/* mv-provider-portal — provider portal settings extras */
.AdminView #hotspotCreator .hotspotCreator-hotspot{min-width:80px;min-height:80px}
.pageLinkItem{display:flex;gap:25px;align-items:center}

/* Bootstrap .collapse compatibility: Tailwind generates .collapse{visibility:collapse} which hides the Bootstrap sidebar. Higher specificity wins. */
.navbar-collapse.collapse,.navbar-collapse.collapse.in,.hide_menus.collapse,.collapse.in{visibility:visible!important}

.collapse.new {
    visibility: visible;
}
/* ══════════════════════════════════════════════════════════════════════════════
   MAVENTRA UI OVERHAUL — Modern Inter-based design system
   All rules are OUTSIDE @layer so they beat Bootstrap's unlayered CSS.
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Restore Bootstrap rem base overridden by Tailwind preflight ─────────────── */

.pagiDir .pagination{
    padding: 15px 0;
}
.tw-btn-secondary, .tw-btn-success{
    font-size:1.2rem;
}
.tw-btn-info {
    font-size: 1.2rem;
    line-height: 2.1;
}
.quizSurveyouter{
    padding: 10px 0;
}
#modalShowLiveQuiz .modal-body{
    overflow: auto !important;
}
html{font-size:62.5%!important;font-family:inherit!important}

/* ── Typography ──────────────────────────────────────────────────────────────── */
body{font-size:13.5px!important;line-height:1.55!important;color:#1e293b!important}
h1{font-size:24px!important;font-weight:700!important;line-height:1.3!important}
h2{font-size:20px!important;font-weight:600!important;line-height:1.35!important}
h3{font-size:17px!important;font-weight:600!important;line-height:1.4!important}
h4{font-size:15px!important;font-weight:600!important}
h5{font-size:14px!important;font-weight:600!important}
h6{font-size:13px!important;font-weight:600!important}
p{font-size:13px!important;line-height:1.6!important}
.pdf_course_new p{
    font-size: 15px !important;
}

/* ── Page layout ─────────────────────────────────────────────────────────────── */
.page-content-wrapper{padding:0px!important}
.main_top_headers{padding:12px 20px!important;margin-bottom:16px!important}
.main_top_headers h1{font-size:18px!important;font-weight:600!important;margin:0!important;color:#1e293b!important}
.portlet{border-radius:12px!important;box-shadow:0 1px 3px rgba(0,0,0,.07),0 1px 2px rgba(0,0,0,.05)!important;border:1px solid #e2e8f0!important}
.portlet>.portlet-title{border-bottom:1px solid #f1f5f9!important;padding:14px 20px!important;font-size:14px!important;font-weight:600!important}
.portletTitleNew{
    justify-content: center !important;
}
.portlet>.portlet-body{padding:20px!important}

/* ── Lucide SVG icon sizing ───────────────────────────────────────────────────── */
.page-sidebar-menu a svg.lucide{width:18px!important;height:18px!important;stroke-width:1.75!important;flex-shrink:0}
.page-header .top-menu svg.lucide,.navbar svg.lucide{width:18px!important;height:18px!important;stroke-width:2!important}
.btn svg.lucide{width:15px!important;height:15px!important;stroke-width:2!important;flex-shrink:0}
.action-btn svg.lucide,.icon-btn svg.lucide{width:16px!important;height:16px!important;stroke-width:1.75!important}
.alert svg.lucide{width:14px!important;height:14px!important;stroke-width:2!important}
svg.lucide{display:inline-block;vertical-align:middle}

/* ── Button base reset ───────────────────────────────────────────────────────── */
.btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;border-radius:8px!important;font-size:13px!important;font-weight:500!important;min-height:34px!important;padding:6px 14px!important;line-height:1.4!important;letter-spacing:0.01em!important;transition:filter .15s ease,box-shadow .15s ease!important;cursor:pointer!important}
.btn:hover{filter:brightness(.93)!important;text-decoration:none!important}
.btn:focus{outline:none!important;box-shadow:0 0 0 3px rgba(59,130,246,.35)!important}
.btn-sm,.btn_small{min-height:28px!important;padding:4px 10px!important;font-size:12px!important;border-radius:6px!important}
.glyphicon{font-family:'Glyphicons Halflings'!important;display:inline-block!important}
.btn_custom_silver{background:#979797!important;color:#fff!important}
.btn_custom_red{background:#006cbe!important;color:#fff!important}
.btn-lg{min-height:42px!important;padding:8px 20px!important;font-size:15px!important;border-radius:10px!important}

/* ── Standard Bootstrap button overrides ─────────────────────────────────────── */
.btn-primary{background:#1f6fe8!important;border-color:#1f6fe8!important;color:#fff!important}
.btn-success{background:#10b981!important;border-color:#10b981!important;color:#fff!important}
.btn-danger{background:#ef4444!important;border-color:#ef4444!important;color:#fff!important}
.btn-warning{background:#f59e0b!important;border-color:#f59e0b!important;color:#fff!important}
.btn-info{background:#3b82f6!important;border-color:#3b82f6!important;color:#fff!important}
.btn-default{background:#f1f5f9!important;border-color:#e2e8f0!important;color:#334155!important}
.btn-link{background:transparent!important;border-color:transparent!important;color:#1f6fe8!important;text-decoration:none!important;filter:none!important}
.btn-link:hover{color:#1558c0!important;text-decoration:underline!important;filter:none!important}

/* ── Custom app button classes ───────────────────────────────────────────────── */
.btn-pprimary{background:#1f6fe8!important;border-color:#1f6fe8!important;color:#fff!important}
.btn-iinfo{background:#3b82f6!important;border-color:#3b82f6!important;color:#fff!important}
.btn-rred{background:#ef4444!important;border-color:#ef4444!important;color:#fff!important}
.btn-ppurrle{background:#8b5cf6!important;border-color:#8b5cf6!important;color:#fff!important}
.btn-orrange{background:#f59e0b!important;border-color:#f59e0b!important;color:#fff!important}
.btn-grreen{background:#10b981!important;border-color:#10b981!important;color:#fff!important}
.btn-ddaarrk{background:#334155!important;border-color:#334155!important;color:#fff!important}
.btn_custom_blue{background:#1f6fe8!important;border-color:#1f6fe8!important;color:#fff!important}
.btn_custom_yellow{background:#f59e0b!important;border-color:#f59e0b!important;color:#fff!important}

/* ── Reset Tailwind global table overrides that break Metronic ───────────────── */
table{min-width:0!important;font-size:inherit!important;line-height:inherit!important}

/* ── Tables ──────────────────────────────────────────────────────────────────── */
.table{font-size:13px!important;min-width:0!important;width:100%!important}
.table>thead>tr>th{font-size:12px!important;text-transform:uppercase!important;letter-spacing:0.06em!important;color:#64748b!important;font-weight:600!important;padding:10px 16px!important;border-bottom:1px solid #e2e8f0!important;background:#f8fafc!important;white-space:nowrap!important}

.multiheaderNew > thead > tr > th {
    border:1px solid #e2e8f0 !important;
}

.table>tbody>tr>td{padding:10px 16px!important;font-size:13px!important;vertical-align:middle!important;border-bottom:1px solid #f1f5f9!important;color:#334155!important}
.table>tbody>tr:hover>td{background:#f8fafc!important}
.table-striped>tbody>tr:nth-of-type(odd)>td{background:#f8fafc!important}
.table-bordered{border:1px solid #e2e8f0!important}
.table-bordered>tbody>tr>td,.table-bordered>thead>tr>th{border:1px solid #bcbcbc!important}
.table-bordered>tbody>tr>td.wrongorder{
    background-color: #ffeaea !important;
    color: #000 !important;
} 

/* ── Form controls ───────────────────────────────────────────────────────────── */
.form-control{font-size:13px!important;border-radius:8px!important;border:1px solid #cbd5e1!important;padding:6px 12px!important;color:#334155!important;min-height:34px!important;transition:border-color .15s ease,box-shadow .15s ease!important}
.form-control:focus{border-color:#1f6fe8!important;box-shadow:0 0 0 3px rgba(31,111,232,.18)!important;outline:none!important}
.form-group label{font-size:13px!important;font-weight:500!important;color:#475569!important;margin-bottom:5px!important}
.input-group-addon{font-size:13px!important;border:1px solid #cbd5e1!important;background:#f1f5f9!important;color:#64748b!important}
.form-group label.faq-type-option{
    margin: 0 !important;
}

/* ── Nav tabs ────────────────────────────────────────────────────────────────── */
.nav-tabs{border-bottom:2px solid #e2e8f0!important}
.nav-tabs>li>a{font-size:13px!important;font-weight:500!important;color:#64748b!important;border:none!important;border-bottom:2px solid transparent!important;margin-bottom:0px!important;padding:10px 16px!important;border-radius:0!important;transition:color .15s ease,border-color .15s ease!important}
.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover{color:#1f6fe8!important;border-bottom-color:#1f6fe8!important;background:transparent!important;font-weight:600!important}
.nav-tabs>li>a:hover{color:#334155!important;background:transparent!important}

/* ── Breadcrumb font override (tailwind-ui sets .breadcrumb to .875rem=8.75px — restore readable size) */
.breadcrumb,.new_breadcrames{font-size:13px!important;line-height:1.55!important}

/* ── Pagination ──────────────────────────────────────────────────────────────── */
.pagination>li>a,.pagination>li>span{font-size:13px!important;padding:6px 10px!important;border-radius:6px!important;margin:0 2px!important;border:1px solid #e2e8f0!important;color:#334155!important}
.pagination>li.active>a,.pagination>li.active>span{background:#1f6fe8!important;border-color:#1f6fe8!important;color:#fff!important}
.pagination>li>a:hover{background:#f1f5f9!important;border-color:#cbd5e1!important;color:#334155!important}
.pagination > li.active > a:hover{background:#1f6fe8!important;border-color:#1f6fe8!important;color:#fff!important}

/* ── Badges & labels ─────────────────────────────────────────────────────────── */
.label{font-size:11px!important;font-weight:600!important;border-radius:4px!important;padding:0.2em 0.5em!important}

/* ── Sidebar nav refinements ─────────────────────────────────────────────────── */
.page-sidebar-menu>li>a{display:block!important;font-weight:500!important}
/* .page-sidebar-menu>li.active>a,.page-sidebar-menu>li.active.open>a{font-weight:600!important} */

/* ── Mini sidebar (page-sidebar-closed) flyout sub-menu ─────────────────────── */
.page-sidebar-closed .page-sidebar-menu>li>.sub-menu{width:196px!important;max-width:196px!important;overflow:hidden!important}
.page-sidebar-closed .page-sidebar-menu>li>.sub-menu>li>a{white-space:normal!important;font-size:1.3rem!important}
/* Restore dark flyout background in open state (not just hover) */
.page-sidebar-closed ul.page-sidebar-menu>li.open>.sub-menu{background:#5F7E91!important;overflow:hidden!important;border-bottom-right-radius:25px!important}
.page-sidebar-closed ul.page-sidebar-menu>li.end.open>.sub-menu{border-top-right-radius:25px!important;border-bottom-right-radius:0!important}
.page-sidebar-closed ul.page-sidebar-menu>li.open>.sub-menu>li>a{color:#fff!important}
.page-sidebar-closed ul.page-sidebar-menu>li.open>.sub-menu>li>a:hover{background:rgba(0,0,0,.15)!important}
/* ── Provider layout: sidebar always full-width, undo mini-sidebar sub-menu constraints ── */
.provider-module .page-sidebar-menu>li>.sub-menu{width:auto!important;max-width:none!important;overflow:visible!important}
.provider-module .page-sidebar-closed .page-sidebar-menu>li>.sub-menu{width:auto!important;max-width:none!important;overflow:visible!important}

/* ── Leaderboard — remove inner scroll created by .client-box .dash-box ─────── */
.big-rank2 .portlet-body{overflow:visible!important}
.big-rank2 .dash-box{overflow:visible!important}

/* ── Recent Activities stat labels ─────────────────────────────────────────── */
.activity-text h1{font-size:1.3rem!important;font-weight:600!important;margin-bottom:0.4rem;line-height:2.0rem;padding-bottom:0.3rem;border-bottom:1px solid #ddd}

/* ── Alerts ──────────────────────────────────────────────────────────────────── */
.alert{font-size:13px!important;border-radius:8px!important;padding:12px 16px!important}

/* ── Modals ──────────────────────────────────────────────────────────────────── */
.modal-content{border-radius:12px!important;border:none!important;box-shadow:0 20px 60px rgba(0,0,0,.15)!important}
.modal-header{padding:16px 20px!important;border-bottom:1px solid #f1f5f9!important}
.modal-header .modal-title{font-size:16px!important;font-weight:600!important}
.modal-footer{padding:14px 20px!important;border-top:1px solid #f1f5f9!important}
.modal-body{padding:20px!important;font-size:13px!important}
.addSectionmodBody{
    padding: 0px 20px !important;
}
.cgModals .modal-body{
    overflow:auto !important;
}

.cgModals .modal-body .multiSelectcg{
    width: stretch;
}

.cgModals #selectemp .select-dropdown{
    position:unset;
    max-height: 200px;
}

.cgModals .assingPlanmodalfooter{
    margin: 0 !important;
}

.kanbanInner{
    padding: 10px;
}
.kanbanInner .form-group{
    padding: 5px;
}
.kanbanInner .form-group button{
    height: stretch !important;
}
.qnmFlex{
    display: flex;
    align-items: center;
    gap: 10px;
}

.qnmFlex .input-group input[type="number"]{
    border-radius: 0 4px 4px 0 !important;
    border-left: none !important;
}

.courseChoice{
        display: flex;
    align-items: end;
    gap: 10px;
}
.choiceActions{
        transform: translateY(-6px);
}
.courseChoice .ctmerros{
    position: absolute;
}
.tablePagination{
        background: #f2f3fe;
padding: 10px;
height: fit-content;
text-align: end;
}

.addCommenttitle{
    font-size: 1.3rem;
}

.mvBulkimport{
    gap:7px;
}
    
.commentDDouter{
text-align: end;
width: fit-content;
}
.commentDDouter .dropdown .dropdown-menu{
    text-align: start;
}

.footerqueTflex{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.courseImgnew{
    width: 200px;
    height: 200px;
    object-fit: cover;
}
.addEditActions{
    padding: 0 0 40px 0;
}
.inutanswer textarea{
    scrollbar-width: none;
}

.input-groupNew{
    display: flex;
    gap: 7px;
}
.input-groupNew oi-select{
    width: 96%;
}
.schType{
    padding: 7px 0 0 5px;
}
.tutModaltable{
    border-collapse: collapse;
}
.tutModaltable th, .tutModaltable td{
        border: 1px solid #e6e6e6;
    padding: 10px !important;
}
#InvoiceDetail .modal-footer{
        margin-top: 0px !important;
    border-top: 1px solid #e6e6e6 !important;
}
#InvoiceDetail .modal-header{
    border-bottom: 1px solid #e6e6e6 !important;
}
.dGrid2{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 7px;
}
#ExtendDueDateGroupQuiz .uib-datepicker-popup.dropdown-menu{
    position: unset !important;
}
#ExtendDueDateGroupQuiz .input-group-btn{
    vertical-align: top !important;
}
.learnerFlex{
    display: flex;
    gap:7px;
    align-items: center;
}
.learnerFlex img.studentimglist{
    border-radius: 50%;
    height: 30px;
    width: 30px;
}
.btnRowflex{
    display: flex;
    justify-content: center;
    align-items: center;
    gap:5px;
}
.curriculum-titlee{
    padding: 10px;
}
.curriculum-titlee .collapse{
    visibility: visible;
}
.statusGrp .dropdown-menu{
    margin-left: -53px;
}

.statusGrp .dropdown-menu li > a{
    padding: 6px;
}
.otherDetailslink{
    color: blue;
    text-decoration: underline;
}
#assign_certificate .uib-datepicker-popup.dropdown-menu{
    left: -170px !important;
}
.marksInp{
    width: 105px !important;
}
.calendarBtn{
        border: 1px solid #cbd5e1;
    height: 100%;
    padding: 10px;
    border-left: none;
    border-radius: 0 10px 10px 0;
}
#assign_certificate .tbl-panel .lst-grid .uib-daypicker tbody td, #assign_certificate .tbl-panel .lst-grid .uib-daypicker thead th {
    padding: 3px !important;
}

.setcssorder {
    font-size: 1.5rem;
    border: 1px solid rgb(221, 221, 221);
    padding: 10px;
    width: 100%;
    display: block;
    line-height: 1.2;
}

#modalBatchSelect input[type="radio"]{
border-radius: 50% !important;
 box-shadow: none;
}

.certNotfoundImg{
    height: 20rem;
}


.certificate-wrapper{
    width:100%;
    /* overflow:auto; */
    display:flex;
    justify-content:center;
}

.main-body-certificate > div{
    transform-origin:top center;
}

#SendEmailpopup oi-select{
        border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    overflow: hidden;
    box-shadow: none !important;
}
#SendEmailpopup oi-select .select-search{
    border:none !important;
}
.pageContentClient{
    margin-left: 57px !important;
}
.radio_client label {
    margin: 0px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 5px 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap:3px;
}

/* .radio_client label span input{
    border: 1px solid #8b8b8b;
    height: 12px;
    width: 12px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

} */
 
 .radio_client label:has(input[type="radio"]:checked) {
        border-color: #1f6fe8 !important;
    box-shadow: 0 0 0 2px rgba(31, 111, 232, .18) !important;
    background: #eff9ff;
    color: black !important;
}
.radio_client label .radio, .radio_client label .radio span{
    display: flex;
    justify-content: center;
    align-items: center;
}
.radio_client label input[type="radio"]{
    width: 10px;
    height: 10px;
    margin: 0;
    box-shadow: none;
}

#update_payment .form-group{
    margin-bottom: 10px !important;
}

#update_payment .radioInpGrp{
    display: flex;
    align-items: center;
    gap: 5px;
}
.modeofpaymetn{
        border: 1px solid #cbd5e1;
    padding: 5px 10px;
    border-radius: 10px;
    margin: 0 5px 0 0;
    display: flex;
    width: fit-content;
    align-items: center;
    gap: 3px;
    cursor: pointer;
}

.modeofpaymetn input{
    border-radius: 50% !important;
    box-shadow: none;
}

.matchDivs{
    display: flex;
    gap: 5px;
}
.matchDivsinner{
    padding:5px;
}
.matchList{
    flex-direction: column;
    gap:10px;
}
.matchList li{
    display:flex; align-items:center; gap:10px; border:1px solid #dedfe1; padding:0.5rem; border-radius:0.7rem; margin-bottom:10px;
}
.matchOpts{
    border: 1px solid #dedfe1 !important;
    padding: 7px 5px !important;
    flex: 1;
    height: stretch;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.2;
}
.matchOpts span{
    text-align: center;
}
.clickcheck.radio{
    border-radius: 50% !important;
    height: 14px !important;
    width: 14px !important;
    min-height: 14px;
    min-width: 14px;
}
.linkText{
    color:blue;
}
.linkText:hover{
    color:blue;
}
.label-warning.warnLab{
        box-shadow: none;
    margin: 5px 0;
    display: block;
    font-size: 15px;
}

/* support ticket UI */

.ticketHeader{
    background: linear-gradient(to right, #f8f9fa, #fdeef1, #eef3fd);
    font-family: 'Poppins';
}
.titleDivfooter p {
    margin: 0;
    font-size: 14px !important;
}
.tickNo {
    font-size: 15px;
    color: black;
    line-height: normal;
}
.tickDetils {
    font-size: 16px !important;
}
.ticketContainer .chat1Send {
    padding: 4px 10px;
    display: flex;
    align-items: center;
    gap: 0px;
    border-radius: 27px;
    justify-content: space-between;
    background: #ffffff;
    position: relative;
    box-shadow: 2px 2px 8px -5px rgba(0, 0, 0, 0.75);
    border: 1px solid #e6e6e6;
}
.ticketContainer .fileList {
    position: absolute;
    top: -55px;
    left: 0;
    gap: 10px;
    margin-left: 0px;
}
.chat1Send button {
    display: flex;
    justify-content: center;
    align-items: center;
}
.ticketContainer .chat1Send input {
    width: 100%;
    border: none;
    outline: none;
    background-color: transparent;
}
.ticketContainer .tickStatus {
    padding: 10px 15px;
    margin-bottom: 5px;
    font-family: 'Poppins';
    border-top: 1px solid #e7e7e7;
}
.ticketContainer .chatCol {
    border-left: 1px solid #e7e7e7;
}
.ticketContainer .notAss {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2%;
    height: 100%;
}
.ticketContainer .customAlert {
    display: flex;
    gap: 5px;
    background: #fff7c5;
    padding: 10px;
    font-family: 'Poppins';
}
.ticketContainer .customAlert span {
    color: orange;
}
.ticketContainer .notAssip1 {
    font-size: 20px !important;
    font-weight: 600;
    color: orange;
    margin-bottom: 5px;
}
.ticketContainer .notAssip2 {
    font-size: 16px !important;
    line-height: normal !important;
    font-family: 'Poppins';
}

.ticketContainer .chat1{
    height:22rem;
    overflow:auto;
}
.ticketContainer .chat1Msg{
    font-family:"Poppins",sans-serif;
}

.ticketContainer .tickChat {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.ticketContainer .tickChatHeader {
    padding: 10px 15px;
    border-bottom: 1px solid #e7e7e7;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.ticketContainer .sendersIni {
    font-size: 20px;
    border: 1px solid black;
    border-radius: 50%;
    height: 40px;
    width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
}
.ticketContainer .sendersName {
    text-transform: capitalize;
    font-family: "Poppins";
    font-size: 16px;
}
.ticketContainer .offline-dot {
    height: 13px;
    width: 13px;
    display: inline-block;
    margin: 0px;
    background-color: #ff9400;
    border-radius: 50%;
    position: relative;
    top: 0px;
}
.ticketContainer .tickChatBody {
    padding: 10px 15px;
    height: 34rem;
    width: 100%;
    overflow: auto;
}

.ticketContainer .tickChatFooter {
    padding: 10px 15px;
    border-top: 1px solid #e7e7e7;
    background: #d8d8d8;
    flex-grow: 1;
    display: flex;
    align-items: center;
}
.ticketContainer .inpGrp2 {
    display: flex;
    align-items: center;
    background-color: white;
    padding: 7px 10px;
    justify-content: space-between;
    width: 100%;
    border-radius: 20px;
}
.ticketContainer .inpGrp2 button {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    color: black;
    border: none;
    outline: none;
}
.ticketContainer .inpGrp2 input {
    width: 100%;
    border: none;
    outline: none;
}
.ticketContainer li.received .chat_msg {
    background: #ffeef1;
    padding: 10px;
    border-radius: 10px;
    word-wrap: break-word;
}
.ticketContainer .chat_msgs {
    background: #dededeb8;
    padding: 10px;
    border-radius: 10px;
    word-wrap: break-word;
}
/* support ticket UI */

#InvoiceDetail .mv-modal__body{
    flex-direction: row;
}

#InvoiceDetail .mv-modal__body .pkg-info-row{
    flex: 1;
    border: 1px solid #e6e6e6;
    padding: 5px;
    text-align: center;
    border-radius: 10px !important;
}
#InvoiceDetail .mv-modal__body .pkg-info-row .pkg-info-row__value {
    font-size: 14px;
}

.jpInner{
    padding: 5px 10px;
}
.jpInner .select-search{
    border:1px solid #cbd5e1 !important;
    border-radius: 8px !important;
}
.jpInner input[type="radio"]{
    border-radius: 50% !important;
}


.jpCustomTable{
    border:1px solid #e6e6e6;
    padding: 5px;
}
.matchPairlinew{
    display: flex;
    align-items: center;
    gap: 0px !important;
    padding: 0 5px;
}
.match-pairs-new{
    border: 1px solid #e6e6e6;
    padding: 5px;
    flex:1;
    height: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

#client-pay-delete-confirm .modal-dialog.modal-sm{
    width: 375px;
}
#client-pay-delete-confirm .confirm-dialog__body {
    padding: 28px 10px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
}

.customPagination{
    text-align: end;
    padding: 10px;
    background: #f1f5f9;
}
.repostLst{
    border-bottom: none;
    border-radius: 12px 12px 0 0 !important;
     scrollbar-width: auto; 
    scrollbar-color: #888 #f1f1f1;
}

.uploadContentForm .mv-form-label{
text-align: left;
}
.uploadContentForm .help-block {
    font-size: 1.2rem;
}

.selectCourse oi-select .select-search{
        border: 1px solid #cbd5e1;
    border-radius: 8px !important;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
}
#c-createnewcourse oi-select .select-search{
    border:1px solid #cbd5e1 !important;
    border-radius: 8px !important;
}
#c-createnewcourse oi-select:not(.multiple) .select-search-list-item_selection:not(:active){
    background-color: transparent !important;
}

.hotspot-parent {
    position: relative;
    display: inline-block;
}

.hotspot-image {
    display: block;
    max-width: 100%;
    height: 500px !important;
}

.AnswerDiv {
    position: absolute;
    background:rgb(255 0 0 / 75%);
    border: 2px solid red;
    box-sizing: border-box;
    height: 30px !important;
    width: 30px !important;
    display:flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    color:white;
    border-radius: 5px !important;
}

.createQuizFooter{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding:10px 0;
    width:100%;
}
.createQuizFooter2{
    padding: 10px;
}
.all-que .panel-title{
    display: flex;
    gap: 5px;
}
.activitytype input{
    margin:0;
}
.activitytype.DueDate{
    color:#7c3aed;
}

.activitytype.Practice{
    color:#2563eb;
}

.activitytype.Interview{
    color:#d97706;
}

.orderingqu.Instructor li{
    gap: 5px;
    align-items: stretch;
}

.orderingqu.Instructor li .opts, .orderingqu.Instructor li .rAns{
    padding: 5px 10px;
    border: 1px solid #d0d0d0;
    border-radius: 5px !important;
    max-width: 20rem;
    min-width: 20rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.orderingqu.Instructor li .opts span, .orderingqu.Instructor li .rAns span{
    font-size: 18px;
}
#c-ChangeDueDate .mv-form-row, #c-Assign .mv-form-row{
    margin-bottom: 10px;
    padding: 0;
}
#c-ChangeDueDate .mv-form-row.flx{
    flex-direction: row;
    margin-bottom: 12px;
}

#c-ChangeDueDate .mv-form-row.flx .label-danger{
    font-size: 12px !important;
    padding: 0.5em 0.5em !important;
}
.jpDesc{
    width: 300px;
    white-space: normal;
}

.no-padding-pane{
    padding: 0 !important;
}
.modFooter {
    margin-top: 10px;
}
.upload-crop-modal__file-label{
    align-items: center !important;
}
.upload-crop-modal__file-icon i{
    font-size: 16px;
    margin: 2px 0 0 3px;
}
.upload-crop-modal__crop-wrap {
    margin: 10px auto;
}

.data-table-search{
    font-weight: normal;
    width: fit-content;
}

.customInpGrp{
    display: flex;
    width: stretch;
}
.customInpGrp .input-group-btn{
    flex-shrink: 0;
    width: auto;
}
.customInpGrp .input-group-btn button{
    height: 100%;
    border-radius: 0 8px 8px 0;
}
.customInpGrp .input-group-btn button:hover{
    transform: translateY(0px);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
    border: 1px solid #cbd5e1 !important;
}
.customInpGrp input{
    border-radius: 8px 0 0 8px !important;
    border-right: none !important;
}

/* ── Dashboard stat cards ────────────────────────────────────────────────────── */
.dashboard-stat {
    border-radius: 12px !important;
    padding: 20px !important;
    min-height: unset !important
}
.dashboard-stat .details .number{font-size:28px!important;font-weight:700!important;line-height:1.2!important}
.dashboard-stat .details .desc{font-size:12px!important;font-weight:500!important;letter-spacing:0.04em!important;text-transform:uppercase!important}

/* ══════════════════════════════════════════════════════════════════════════════
   BOOTSTRAP-MATCHING BREAKPOINT GRID UTILITIES
   Generated manually because npm run build:tailwind cannot run without node_modules.
   These replace Bootstrap col-sm-* / col-md-* / col-lg-* after grid-replace.ps1.
   Selectors use Tailwind's escaped colon+slash convention: bs-md\:w-6\/12
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Base width utilities (no breakpoint — replaces col-xs-*) ────────────────── */
.w-full{width:100%}
.w-1\/12{width:8.333333%}.w-2\/12{width:16.666667%}.w-3\/12{width:25%}
.w-4\/12{width:33.333333%}.w-5\/12{width:41.666667%}.w-6\/12{width:50%}
.w-7\/12{width:58.333333%}.w-8\/12{width:66.666667%}.w-9\/12{width:75%}
.w-10\/12{width:83.333333%}.w-11\/12{width:91.666667%}

/* ── flex utilities for row replacement ──────────────────────────────────────── */
.flex{display:flex}.flex-wrap{flex-wrap:wrap}
.float-right{float:right !important}.float-left{float:left}
.overflow-x-auto{overflow-x:auto}
.px-4{padding-left:16px;padding-right:16px}
.ml-auto{margin-left:auto}

/* ── bs-sm: — 768px (replaces col-sm-*) ─────────────────────────────────────── */
@media(min-width:768px){
.bs-sm\:w-full{width:100%}
.bs-sm\:w-1\/12{width:8.333333%}.bs-sm\:w-2\/12{width:16.666667%}.bs-sm\:w-3\/12{width:25%}
.bs-sm\:w-4\/12{width:33.333333%}.bs-sm\:w-5\/12{width:41.666667%}.bs-sm\:w-6\/12{width:50%}
.bs-sm\:w-7\/12{width:58.333333%}.bs-sm\:w-8\/12{width:66.666667%}.bs-sm\:w-9\/12{width:75%}
.bs-sm\:w-10\/12{width:83.333333%}.bs-sm\:w-11\/12{width:91.666667%}
}

/* ── bs-md: — 992px (replaces col-md-*) ─────────────────────────────────────── */
@media(min-width:992px){
.bs-md\:w-full{width:100%}
.bs-md\:w-1\/12{width:8.333333%}.bs-md\:w-2\/12{width:16.666667%}.bs-md\:w-3\/12{width:25%}
.bs-md\:w-4\/12{width:33.333333%}.bs-md\:w-5\/12{width:41.666667%}.bs-md\:w-6\/12{width:50%}
.bs-md\:w-7\/12{width:58.333333%}.bs-md\:w-8\/12{width:66.666667%}.bs-md\:w-9\/12{width:74%}
.bs-md\:w-10\/12{width:83.333333%}.bs-md\:w-11\/12{width:91.666667%}
}

/* ── bs-lg: — 1200px (replaces col-lg-*) ────────────────────────────────────── */
@media(min-width:1200px){
.bs-lg\:w-full{width:100%}
.bs-lg\:w-1\/12{width:8.333333%}.bs-lg\:w-2\/12{width:16.666667%}.bs-lg\:w-3\/12{width:25%}
.bs-lg\:w-4\/12{width:33.333333%}.bs-lg\:w-5\/12{width:41.666667%}.bs-lg\:w-6\/12{width:50%}
.bs-lg\:w-7\/12{width:58.333333%}.bs-lg\:w-8\/12{width:66.666667%}.bs-lg\:w-9\/12{width:75%}
.bs-lg\:w-10\/12{width:83.333333%}.bs-lg\:w-11\/12{width:91.666667%}
}

/* ── Curriculum page header ─────────────────────────────────────────────────── */
.mv-page-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;background:#fff!important;border-radius:12px!important;box-shadow:0 1px 3px rgba(0,0,0,.05),0 4px 16px rgba(99,102,241,.07)!important;padding:20px 24px!important;margin-bottom:24px!important;border:none!important;border-top:3px solid #6366f1!important}
.mv-page-header__left{display:flex;flex-direction:row;align-items:center;gap:14px}
.mv-page-header__title-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.mv-page-header__title{font-size:18px!important;font-weight:700!important;color:#1e293b!important;display:flex!important;align-items:center!important;gap:12px!important;line-height:1.3!important;margin:0!important}
.mv-page-header__icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;background:#eef2ff;border-radius:10px;flex-shrink:0}
.mv-page-header__icon i{color:#6366f1;font-size:18px}
.mv-page-header__breadcrumb{background:transparent!important;padding:0!important;margin:0!important;font-size:12px;display:flex;align-items:center;list-style:none;gap:6px}
.mv-page-header__breadcrumb li{display:inline-flex;align-items:center}
.mv-page-header__breadcrumb .ph-bc-link{color:#6366f1;text-decoration:none;font-weight:500;display:inline-flex;align-items:center;gap:4px}
.mv-page-header__breadcrumb .ph-bc-link:hover{color:#4f46e5;text-decoration:underline}
.mv-page-header__breadcrumb .ph-bc-sep{color:#cbd5e1;font-size:9px}
.mv-page-header__breadcrumb .ph-bc-active{color:#475569;font-weight:500;background:#f1f5f9;border-radius:4px;padding:2px 8px}
.mv-page-header__actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ph-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 20px;border-radius:999px;font-size:14px;font-weight:600;text-decoration:none;cursor:pointer;border:none;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,opacity .15s;line-height:1.4;white-space:nowrap}
.ph-btn--primary{
    background: #6366f1;
    color: white;
    border-radius: 7px !important;
}
.backOuter{
    display: flex;
    justify-content: end;
    padding: 0 0 5px 0;
}
.ph-btn--back{
    width:fit-content;
}
.ph-btn:hover{text-decoration:none;transform:translateY(-2px)}
.ph-btn--indigo{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff!important;box-shadow:0 2px 8px rgba(99,102,241,.35)}
.ph-btn--indigo:hover{box-shadow:0 6px 18px rgba(99,102,241,.45)}
.ph-btn--purple{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff!important;box-shadow:0 2px 8px rgba(139,92,246,.35)}
.ph-btn--purple:hover{box-shadow:0 6px 18px rgba(139,92,246,.45)}
.ph-btn--cyan{background:linear-gradient(135deg,#0891b2,#0e7490);color:#fff!important;box-shadow:0 2px 8px rgba(8,145,178,.35)}
.ph-btn--cyan:hover{box-shadow:0 6px 18px rgba(8,145,178,.45)}
.ph-btn--green{background:linear-gradient(135deg,#059669,#047857);color:#fff!important;box-shadow:0 2px 8px rgba(5,150,105,.35)}
.ph-btn--green:hover{box-shadow:0 6px 18px rgba(5,150,105,.45)}

.changeStatusbtn{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
#certiDiv .main-body-certificate {
    width: 100%;
    overflow: hidden;
    position: relative;
}

#certiDiv .scale-wrapper {
    display: inline-block;
    transform-origin: top left;
}
/* ── Curriculum filter bar ──────────────────────────────────────────────────── */
.curriculum-filter-bar{display:flex;align-items:flex-end;flex-wrap:nowrap;gap:12px;background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:16px 24px;margin-bottom:20px}
.curriculum-filter-bar__inputs{display:flex;flex-wrap:nowrap;gap:12px;flex:1 1 auto;min-width:0}
.curriculum-filter-bar__field{display:flex;flex-direction:column;gap:4px;flex:1 1 0;min-width:0}
.curriculum-filter-bar__field label{font-size:11px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin:0}
.cf-control{border:1px solid #e2e8f0!important;border-radius:8px!important;font-size:13px!important;color:#1e293b!important;background:#f8fafc!important;padding:8px 12px!important;height:auto!important;transition:border-color .15s,box-shadow .15s!important}
.cf-control:focus{border-color:#6366f1!important;box-shadow:0 0 0 3px rgba(99,102,241,.15)!important;background:#fff!important;outline:none!important}
.curriculum-filter-bar__actions{display:flex;gap:8px;align-items:flex-end;flex-shrink:0}
.ph-btn--outline{background:#fff;color:#64748b!important;border:1.5px solid #cbd5e1;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.ph-btn--outline:hover{background:#f8fafc;color:#1e293b!important;border-color:#94a3b8;box-shadow:0 4px 12px rgba(0,0,0,.10)}

.ph-btn--outline.scrmAdd{
    padding: 3px 13px;
}
.ph-btn--outline.scrmAdd svg{
    height: 16px;
    width: 16px;
}

/* ── mv-page-header extensions ──────────────────────────────────────────────── */
.mv-page-header__title-group{display:flex;flex-direction:column;gap:6px}
.mv-page-header__subtitle{font-size:12px;font-weight:400;color:#94a3b8;margin-left:6px}
.mv-page-header__meta{display:flex;gap:12px;align-items:center;flex-shrink:0;flex-wrap:wrap}
.mv-page-header__meta-item{font-size:12px;color:#475569;padding:8px 14px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;display: flex;align-items: center;gap: 5px;line-height: 1;}
.mv-page-header__meta-item strong{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#6a7788;margin-bottom:0px}
.sd-url-badge{display:flex;flex-direction:row; align-items: center; gap:2px;padding:6px 12px;background:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;text-decoration:none;transition:background .15s,border-color .15s;flex-shrink:0}
.sd-url-badge:hover{background:#e0f2fe;border-color:#7dd3fc;text-decoration:none}
.sd-url-badge__label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#0369a1;line-height:1}
.sd-url-badge__link{font-size:12px;font-weight:500;color:#0284c7;display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.sd-url-badge__link i{font-size:10px;flex-shrink:0}
.mv-page-header__right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.ph-btn--sm{padding:5px 12px!important;font-size:11px!important;gap:4px!important}
.ph-btn--amber{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff!important;box-shadow:0 2px 8px rgba(245,158,11,.35)}
.ph-btn--amber:hover{box-shadow:0 6px 18px rgba(245,158,11,.45)}
.stat-bar{display:flex;justify-content:flex-end;margin-bottom:16px}
/* ── Announcement list ──────────────────────────────────────────────────────── */
.ann-list{display:flex;flex-direction:column}
.ann-item{display:flex;align-items:flex-start;gap:10px;padding:12px 0;border-bottom:1px solid #f1f5f9}
.ann-item:first-child{padding-top:4px}
.ann-item:last-child{border-bottom:none;padding-bottom:0}
.ann-item__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.ann-item__date{font-size:11px;color:#94a3b8;font-weight:500;display:flex;align-items:center;gap:4px}
.ann-item__date i{font-size:10px}
.ann-item__text{font-size:13px;color:#475569;line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ann-item__actions{flex-shrink:0;padding-top:2px}

/* ── Leaderboard ─────────────────────────────────────────────────────────── */
.lb-list{display:flex;flex-direction:column;gap:4px;padding:4px 0}
.lb-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;border-left:3px solid transparent;transition:background .15s}
.lb-item:hover{background:#f8fafc}
.lb-item:nth-child(1){background:#fffbeb;border-left-color:#f59e0b}
.lb-item:nth-child(2){background:#f8fafc;border-left-color:#94a3b8}
.lb-item:nth-child(3){background:#fff7f2;border-left-color:#c27a3a}
.lb-rank{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#94a3b8;background:#f1f5f9;flex-shrink:0}
.lb-item:nth-child(1) .lb-rank{background:#fef3c7;color:#d97706}
.lb-item:nth-child(2) .lb-rank{background:#e2e8f0;color:#64748b}
.lb-item:nth-child(3) .lb-rank{background:#fde8d8;color:#c27a3a}
.lb-avatar{width:34px;height:34px;border-radius:50%;overflow:hidden;flex-shrink:0;margin:0;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.1)}
.lb-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.lb-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.lb-name{font-size:13px;font-weight:600;color:#1e293b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-score{font-size:11px;color:#94a3b8;display:flex;align-items:center;gap:3px}
.lb-score i{color:#f59e0b;font-size:10px}

/* ── Media asset counts bar ─────────────────────────────────────────────────── */
.mv-media-counts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-left:auto}
.mv-media-counts__item{display:flex;align-items:center;gap:6px;padding:5px 12px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;font-size:11px}
.mv-media-counts__icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:5px;flex-shrink:0;font-size:11px}
.mv-media-counts__icon--image{background:#ede9fe;color:#7c3aed}
.mv-media-counts__icon--video{background:#fce7f3;color:#db2777}
.mv-media-counts__icon--audio{background:#d1fae5;color:#059669}
.mv-media-counts__icon--doc{background:#dbeafe;color:#2563eb}
.mv-media-counts__icon--template{background:#fff7ed;color:#ea580c}
.mv-media-counts__label{font-weight:500;color:#64748b}
.mv-media-counts__value{font-weight:700;color:#1e293b;font-size:13px;margin-left:2px}
.mv-token-balance-wrap{display:flex;justify-content:flex-end;margin-bottom:16px}.mv-token-balance{display:inline-flex;align-items:center;gap:12px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px 20px;box-shadow:0 2px 10px rgba(0,0,0,.07)}.mv-token-balance__icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:10px;flex-shrink:0}.mv-token-balance__icon i{color:#fff;font-size:18px}.mv-token-balance__label{font-size:11px;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.05em;display:block;margin-bottom:3px}.mv-token-balance__value{font-size:22px;font-weight:700;color:#1e293b;line-height:1;display:block}
.mv-token-balance--sm{padding:6px 12px;border-radius:8px;gap:8px}.mv-token-balance--sm .mv-token-balance__icon{width:28px;height:28px;border-radius:6px}.mv-token-balance--sm .mv-token-balance__icon i{font-size:12px}.mv-token-balance--sm .mv-token-balance__label{font-size:10px;margin-bottom:1px}.mv-token-balance--sm .mv-token-balance__value{font-size:14px}

/* ── AI Token Calculator ────────────────────────────────────────────────────── */
.ai-calc-card{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);margin-bottom:24px;overflow:hidden}
.ai-calc-card__header{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);padding:14px 20px;display:flex;align-items:center;gap:10px;color:#fff}
.ai-calc-card__header i{font-size:16px}
.ai-calc-card__header span{font-size:14px;font-weight:600;letter-spacing:.02em}
.ai-calc-card__body{padding:20px 24px}
.ai-calc-service-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:20px}
.ai-calc-service-row .ai-calc-field{flex:1 1 220px}
.ai-calc-field--btn{flex:0 0 auto!important}
.ai-calc-service-row label,.ai-calc-result-item label{font-size:11px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em;display:block;margin-bottom:5px}
.ai-calc-divider{height:1px;background:#f1f5f9;margin-bottom:20px}
.ai-calc-results{display:flex;gap:16px;flex-wrap:wrap}
.ai-calc-result-item{flex:1 1 180px}
.ai-calc-result-item--stat .form-control{background:#f8fafc;color:#6366f1;font-weight:700;font-size:15px;border-color:#e2e8f0;cursor:default}
/* ── AI Tab Panel (tabs + connected content, single card) ───────────────────── */
.ai-tab-panel{width:100%;box-sizing:border-box;background:#fff;border-radius:16px;border:1px solid #e2e8f0;box-shadow:0 2px 12px rgba(0,0,0,.07);overflow:hidden;margin-bottom:24px}
.ai-tab-panel.stretch{
    width: stretch;
}
.ai-tab-panel__nav{display:flex;align-items:stretch;gap:0;padding:0;background:#f8fafc;border-bottom:2px solid #e2e8f0;flex-wrap:nowrap;scrollbar-width:none}
.ai-tab-panel__nav::-webkit-scrollbar{display:none}
.ai-tab-panel__tab{flex:1 1 0;min-width:max-content;padding:10px 12px;border-radius:0;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;background:transparent;color:#64748b;font-size:12px;font-weight:600;cursor:pointer;transition:background .18s,color .18s,border-color .18s;display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;line-height:1.4}
.ai-tab-panel__tab:hover{background:#f0f4ff;color:#4f46e5}
.ai-tab-panel__tab--active{background:#eef2ff;color:#6366f1;border-bottom-color:#6366f1;box-shadow:none}
.ai-tab-panel__body{padding:20px 20px 8px}
.ai-tab-panel__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:48px 24px;color:#94a3b8}
.ai-tab-panel__empty i{font-size:32px}
.ai-tab-panel__empty span{font-size:14px;font-weight:500}
/* ── Table action buttons ───────────────────────────────────────────────────── */
.tbl-btn{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid transparent;background:transparent;transition:background .15s,border-color .15s;line-height:1.4;text-decoration:none; width: max-content;}
.tbl-btn--view{color:#6366f1;border-color:#a0b6ff}
.tbl-btn--view i, .tbl-btn--danger i, .tbl-btn--assign i{font-size: 12px;}
.tbl-btn--view svg, .tbl-btn--danger svg, .tbl-btn--assign svg{height: 12px; width: 12px;}

.tbl-btn--view:hover{background:#eef2ff;border-color:#c7d2fe;color:#4f46e5;text-decoration:none}
.tbl-btn--assign{color:#059669;border-color:#059669;}
.tbl-btn--assign:hover{background:#ecfdf5;border-color:#6ee7b7;color:#047857;text-decoration:none}
.tbl-btn--danger{color:#dc2626;border-color:#ff8787}
.tbl-btn--danger:hover{background:#fef2f2;border-color:#fca5a5;color:#b91c1c;text-decoration:none}
.badge-thumb{width:40px;height:40px;object-fit:contain;border:none}
.tbl-btn--warn {
    color: #f1a500;
    border-color: #f1a500;
}
.tbl-btn--warn:hover{background:#fffaef;border-color:#fdb00a;color:#fdb00a;text-decoration:none}

/* ── Bulk import modal ───────────────────────────────────────────────────── */
.bulk-import-bar{display:flex;gap:12px;align-items:flex-start}
.bulk-import-bar__zone{flex:1}
.bulk-import-bar__actions{display:flex;flex-direction:column;gap:8px;flex-shrink:0}
.bulk-import-note{font-size:12px;color:#b45309;background:#fffbeb;border:1px solid #fde68a;border-radius:6px;padding:8px 10px;margin-bottom:10px;display:flex;align-items:flex-start;gap:6px}
.bulk-import-note i{flex-shrink:0;margin-top:1px}
.bulk-import-table-actions{display:flex;gap:8px;margin-top:10px}
.instr-section .tbl-panel{margin-bottom:0}
@media(max-width:600px){.bulk-import-bar{flex-direction:column}.bulk-import-bar__actions{flex-direction:row;flex-wrap:wrap}}

/* ── Confirm dialog ─────────────────────────────────────────────────────── */
.confirm-dialog .modal-content{border-radius:14px;border:none;box-shadow:0 20px 50px rgba(15,23,42,.18);overflow:hidden}
.confirm-dialog__body{padding:28px 24px 20px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.confirm-dialog__icon{width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.confirm-dialog__icon--warning{background:#fef3c7;color:#d97706}
.confirm-dialog__icon--danger{background:#fee2e2;color:#dc2626}
.confirm-dialog__icon--danger i{
    font-size: 20px;
}
.confirm-dialog__icon--success{background:#dcfce7;color:#15803d}
.confirm-dialog__danger-strip{height:4px;background:linear-gradient(90deg,#ef4444,#dc2626);width:100%}
.confirm-dialog__title{font-size:16px !important;font-weight:700;color:#1e293b;margin:0}
.confirm-dialog__message{font-size:15px !important;color:#64748b;line-height:1.7;margin:0}
.confirm-dialog__name{font-weight:700;color:#1e293b}
.confirm-dialog__badge{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:20px;font-size:12px;font-weight:600;vertical-align:middle}
.confirm-dialog__badge--inactive{background:#fef3c7;color:#b45309}
.confirm-dialog__badge--active{background:#dcfce7;color:#15803d}
.confirm-dialog__footer{display:flex;justify-content:center;gap:8px;padding:14px 24px;border-top:1px solid #f1f5f9;background:#f8fafc}

/* ── Instructor modal (add / edit) ──────────────────────────────────────── */
.instr-modal .modal-content{border-radius:14px;border:none;box-shadow:0 24px 64px rgba(15,23,42,.2);overflow:hidden}
.instr-modal-header{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);padding:14px 20px;border-bottom:none;display:flex;align-items:center;gap:12px}
.instr-modal-header .close{
    color: #fff;
    opacity: 1;
}
.instr-modal-icon{width:42px;height:42px;background:rgba(255,255,255,.18);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.instr-modal-icon i{color:#fff;font-size:17px}
.instr-modal-title-wrap{flex:1}
.instr-modal-title{color:#fff;font-size:17px;font-weight:700;margin:0;line-height:1.3}
.instr-modal-subtitle{color:rgba(255,255,255,.72);font-size:12px;margin-top:2px}
.instr-modal-close{background:rgba(255,255,255,.15);border:none;cursor:pointer;color:#fff;font-size:14px;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0}
.instr-modal-close:hover{background:rgba(255,255,255,.3)}
.instr-modal-body{padding:0}
.instr-section{padding:20px 24px;border-bottom:1px solid #e9ecef}
.instr-section:last-child{border-bottom:none}
.instr-section>h4{margin:0 0 10px;font-size:16px;font-weight:700;color:#1e293b;line-height:1.3}
.instr-section__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.instr-section>p{margin:0;font-size:13px;color:#64748b;line-height:1.6}
.instr-section__label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#6366f1;margin-bottom:10px;display:flex;align-items:center;gap:5px}
.instr-section__label i{font-size:10px}
.instr-grid{display:grid;gap:10px}
.instr-grid--3{grid-template-columns:repeat(3,1fr)}
.instr-grid--2{grid-template-columns:repeat(2,1fr)}
.instr-grid--1-2{grid-template-columns:2fr 1fr}
.instr-field{display:flex;flex-direction:column;gap:5px}
.instr-field__label{font-size:12px;font-weight:600;color:#374151;display:flex;align-items:center;gap:4px}
.instr-field__req{color:#dc2626;font-size:9px;line-height:1;margin-top:1px}
.instr-upload-zone{position:relative;border:2px dashed #c7d2fe;border-radius:8px;padding:10px 14px;background:#f5f3ff;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;display:flex;flex-direction:column;align-items:center;gap:4px}
.instr-upload-zone:hover{border-color:#6366f1;background:#eef2ff}
.instr-upload-zone i{font-size:22px;color:#8b5cf6}
.instr-upload-zone span{font-size:12px;color:#6366f1;font-weight:500}
.instr-upload-zone small{font-size:11px;color:#94a3b8}
.instr-upload-zone input[type=file]{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}
.instr-photo-preview{display:flex;align-items:center;gap:10px;margin-top:8px}
.instr-photo-preview__img{width:56px;height:56px;border-radius:8px;object-fit:cover;border:2px solid #e2e8f0}
.instr-photo-preview img{width:56px;height:56px;border-radius:8px;object-fit:cover;border:2px solid #e2e8f0}
.instr-checkbox-row{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:13px;font-weight:500;color:#374151;padding:11px 14px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;transition:background .15s,border-color .15s}
.instr-checkbox-row:hover{background:#eef2ff;border-color:#c7d2fe}
.instr-checkbox-row input[type=checkbox]{width:15px;height:15px;accent-color:#6366f1;cursor:pointer;flex-shrink:0}
.instr-modal-footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:12px 20px;border-top:1px solid #e2e8f0;background:#f8fafc}
#ExtendDueDateGroupQuiz .instr-modal-footer{
    justify-content: flex-start;
}
#ExtendDueDateGroupQuiz .instr-modal-footer .ph-btn--outline svg{
    height: 16px;
    width: 16px;
}
.lst-grid .tableAction{
    display: flex;
    flex-direction: column;
}
.instr-req-note{font-size:11px;color:#94a3b8;display:flex;align-items:center;gap:4px}
.instr-req-note i{font-size:8px;color:#dc2626}
@media(max-width:767px){.instr-grid--3,.instr-grid--2,.instr-grid--1-2{grid-template-columns:1fr}}

/* ── tbl-panel — card wrapper for listings ──────────────────────────────── */
.tbl-panel{background:#fff;border-radius:12px !important;box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden;margin-bottom:20px}
.tbl-panel .lst-grid > table thead th{padding:14px 20px;font-size:13px}
.tbl-panel .lst-grid > table tbody td{padding:14px 20px;border-bottom:1px solid #e2e8f0; white-space:nowrap;}
.tbl-panel .lst-grid > .whiteNormal tbody td,
.tbl-panel .lst-grid > .whiteNormal thead th
 {
    white-space: normal !important;
    vertical-align: middle;
}
.tbl-panel .lst-grid2 > .whiteNormal tbody td{
    word-break: break-all;
}
.tbl-panel .lst-grid > .whiteNormal thead th.table-select{
    width: 45px;
}
.tbl-panel .lst-grid > table tbody tr:last-child td{border-bottom:none}
/* tfoot pagination bar */
.tbl-panel .lst-grid > table tfoot tr{background:#f8fafc}
.tbl-panel .lst-grid > table tfoot td{padding:14px 20px;border-top:1px solid #e2e8f0;text-align:right}

.tbl-panel .prm-scroll table thead th{border:1px solid #b5c5d5; vertical-align: middle;}
.tbl-panel .prm-scroll table tbody td{border:1px solid #b5c5d5; text-align: left !important;}


.tbl-panel .pagination{display:inline-flex;align-items:center;gap:4px;margin:0;padding:0;list-style:none}
.tbl-panel .pagination>li>a,.tbl-panel .pagination>li>span{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 12px;border-radius:8px;font-size:13px;font-weight:500;border:1px solid #e2e8f0;color:#475569;background:#fff;text-decoration:none;transition:background .15s,border-color .15s,color .15s}
.tbl-panel .pagination>li>a:hover{background:#eef2ff;border-color:#c7d2fe;color:#4f46e5;text-decoration:none}
.tbl-panel .pagination>li.active>a,.tbl-panel .pagination>li.active>span{background:#6366f1;border-color:#6366f1;color:#fff!important;font-weight:700}
.tbl-panel .pagination>li.disabled>a,.tbl-panel .pagination>li.disabled>span{color:#cbd5e1;border-color:#f1f5f9;cursor:not-allowed;background:#f8fafc;pointer-events:none}
/* tbl-panel header label */
.tbl-panel>.instr-section__label{padding:14px 20px;border-bottom:1px solid #e2e8f0;background:#f8fafc;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#6366f1;margin-bottom:0;display:flex;align-items:center;gap:6px}
.tbl-panel>.instr-section__label i{font-size:12px;color:#6366f1}
/* tbl-panel header with actions */
.tbl-panel__header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid #e2e8f0;background:#f8fafc;flex-wrap:wrap;gap:8px}
.tbl-panel__title{font-size:12px;font-weight:700;color:#334155;display:flex;align-items:center;gap:6px;text-transform:uppercase;letter-spacing:.07em}
.tbl-panel__title i{color:#6366f1;font-size:12px}
.tbl-panel__actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
/* ── tbl-progress — slim progress bar for table cells ───────────────────── */
.tbl-progress-wrap{display:flex;flex-direction:column;gap:3px;min-width:120px}
.tbl-progress{height:8px;border-radius:99px;background:#e2e8f0;overflow:hidden}
.tbl-progress__fill{height:100%;border-radius:99px;transition:width .3s ease}
.tbl-progress__fill--done{background:#16a34a}
.tbl-progress__fill--mid{background:#6366f1}
.tbl-progress__fill--low{background:#f59e0b}
.tbl-progress__fill--zero{background:#e2e8f0}
.tbl-progress__pct{font-size:11px;color:#64748b;text-align:right;line-height:1}
/* ── Course Sections ─────────────────────────────────────────────────────── */
.sec-toolbar{display:flex;justify-content:flex-end;margin-bottom:16px}
.sec-group{margin-bottom:24px}
.sec-group__header{padding:10px 16px;background:#f8fafc;border-left:3px solid #6366f1;border-radius:4px;margin-bottom:12px}
.sec-group__title{margin:0;font-size:15px;font-weight:700;color:#334155;letter-spacing:normal;display:flex;align-items:center;gap:8px}
.sec-group__title i{color:#6366f1;font-size:14px}
.sec-item{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:16px;margin-bottom:10px}
.sec-item__content{color:#334155;font-size:14px;line-height:1.6;margin-bottom:10px}
.sec-item__actions{display:flex;gap:8px;padding-top:10px;border-top:1px solid #f1f5f9}
.sec-item__edit-actions{display:flex;gap:8px;margin-top:12px}
.sec-modal__field{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.sec-modal__label{font-weight:600;letter-spacing:normal;margin:0;white-space:nowrap;color:#334155;font-size:13px}
.sec-modal__grow{flex:1}
.sec-modal__grow select{letter-spacing:normal}
.sec-check-item{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid #e2e8f0;border-radius:8px;width:100%;margin-bottom:10px;cursor:pointer;transition:background .15s,border-color .15s;letter-spacing:normal}
.sec-check-item:has(input:checked){background:#eff6ff;border-color:#bfdbfe}
.sec-check-item input{flex-shrink:0;margin-top:2px;cursor:pointer}
/* ── FAQ Accordion ───────────────────────────────────────────────────────── */
.faq-item{background:#fff;border:1px solid #e2e8f0;border-radius:8px;margin-bottom:8px;overflow:hidden}
.faq-item__header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;cursor:pointer;transition:background .15s}
.faq-item__header:hover{background:#f8fafc}
.faq-item__header-left{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.faq-item__chevron{color:#6366f1;font-size:14px;transition:transform .2s;flex-shrink:0}
.faq-item__header:not(.collapsed) .faq-item__chevron{transform:rotate(90deg)}
.faq-item__question{font-size:14px;font-weight:600;color:#1e293b;margin:0;letter-spacing:normal;line-height:1.4}
.faq-item__actions{display:flex;gap:6px;flex-shrink:0;margin-left:12px}
.faq-item__body{padding:12px 16px 14px 40px;color:#475569;font-size:13px;line-height:1.6}
.faq-type-radio{display:flex;gap:8px;list-style:none;padding:0;margin:0}
.faq-type-radio li label{border:1px solid #e2e8f0;border-radius:6px;padding:6px 14px;letter-spacing:normal;cursor:pointer;font-size:13px;font-weight:500;color:#64748b;transition:background .15s,border-color .15s,color .15s;display:inline-block}
.faq-type-radio li label input{display:none}
.faq-type-radio li label:has(input:checked){background:#6366f1;color:#fff !important;border-color:#6366f1}
.faq-check-item{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border:1px solid #e2e8f0;border-radius:8px;margin-bottom:10px;cursor:pointer;position:relative;transition:background .15s,border-color .15s;letter-spacing:normal}
.faq-check-item:has(input:checked){background:#eff6ff;border-color:#bfdbfe}
.faq-check-item input{position:absolute;top:12px;right:12px;cursor:pointer}
.faq-check-item__q{font-size:14px;font-weight:600;letter-spacing:normal;color:#1e293b;line-height:1.3;padding-right:28px}
.faq-check-item__a{font-size:13px;line-height:1.4;letter-spacing:normal;color:#475569}
.field-validation-error{color:#dc2626;font-size:12px;display:block;margin-top:4px}
/* ── Assign Plan Modal ───────────────────────────────────────────────────── */
.assign-modal__plan-name{display:flex;align-items:center;gap:8px;padding:12px 20px;background:#f8fafc;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0;font-size:13px;font-weight:600;color:#334155;letter-spacing:normal}
.assign-modal__plan-name i{color:#6366f1;font-size:14px}
.assign-modal__plan-name span{font-weight:400;color:#64748b;margin-left:4px}
/* ── tbl-row-actions — inline action buttons in a table row ─────────────── */
.tbl-row-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
/* ── announce content cell ──────────────────────────────────────────────── */
.announce{font-size:13px;color:#334155;line-height:1.6;display:block;max-height:64px;overflow:hidden}
/* ── mv-modal — custom styled Bootstrap modal ──────────────────────────── */
.mv-modal{border-radius:12px;overflow:hidden;border:none;box-shadow:0 20px 60px rgba(15,23,42,.18)}
.mv-modal__header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;background:#fff;border-bottom:1px solid #e2e8f0}
.mv-modal__title{font-size:16px;font-weight:700;color:#1e293b;margin:0;display:flex;align-items:center;gap:8px}
.mv-modal__title i{color:#6366f1}
.mv-modal__title svg{color:#6366f1; height: 20px; width: 20px;}

.mv-modal__close{background:none;border:none;cursor:pointer;color:#94a3b8;font-size:16px;padding:6px;line-height:1;border-radius:6px;transition:color .15s,background .15s}
.mv-modal__close:hover{color:#1e293b;background:#f1f5f9}
.mv-modal__body{padding:24px}
.mv-modal__footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:16px 24px;border-top:1px solid #e2e8f0;background:#f8fafc}
/* ── vq-question — quiz question card inside c-viewQuiz modal ─────────── */
.vq-question{display:flex;gap:14px;padding:14px 16px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;margin-bottom:12px;align-items:flex-start}
.vq-question:last-child{margin-bottom:0}
.vq-question__num{flex-shrink:0;width:32px;height:32px;border-radius:8px;background:#6366f1;color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}
.vq-question__body{flex:1;min-width:0;font-size:14px;color:#1e293b;line-height:1.6}
.vq-question__body img{max-width:100%;height:auto}
/* ── form field error ────────────────────────────────────────────────────── */
.mv-field-error{font-size:12px;color:#dc2626;margin-top:4px;display:block}
/* ── mv-form-row ─────────────────────────────────────────────────────────── */
.mv-form-row{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
.mv-form-row.addSrcmrow{
    margin-bottom: 0;
}
#EditCurriculumEvent .mv-form-row {
    margin-bottom: 0px;
    padding: 3px 0;
}
#EditCurriculumEvent .mv-form-row.radioCheck{
    flex-direction: row;
}
#c-UpdateApplicationStatus .mv-modal__body .mv-form-row{
    border:none;
    margin-bottom: 0;
}
.customDaterow{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap:5px;
}
.mv-form-static{font-size:13px;font-weight:600;color:#1e293b;padding:8px 12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px}
.mv-form-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.mv-form-2col .mv-form-row--wide{grid-column:1/-1}
@media(max-width:768px){.mv-form-2col{grid-template-columns:1fr}}
.mv-form-hint{font-size:12px;color:#64748b;display:flex;align-items:center;gap:6px;padding:4px 0 12px;margin-top:-8px}
#assigningCourseForm .mv-form-hint{
    display: unset;
}

.mv-form-hintNew{font-size:12px;color:#64748b;display:block;padding:4px 0 12px;margin-top:-8px}
.mv-form-hint i{color:#6366f1}
.mv-form-hintNew i{color:#cb2431;}
.mv-radio-group{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.mv-radio-option{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1.5px solid #e2e8f0;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;color:#475569;transition:border-color .15s,background .15s,color .15s;margin:0;user-select:none}
.mv-radio-option:hover{border-color:#a5b4fc;color:#4338ca}
.mv-radio-option:has(input:checked){border-color:#6366f1;background:#eef2ff;color:#4338ca}
.mv-radio-option input[type=radio]{accent-color:#6366f1;width:14px;height:14px;flex-shrink:0;border-radius: 50% !important; margin: 0;}
/* ── Badge image picker ───────────────────────────────────────────────────── */
.badge-picker{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.badge-picker__item{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 6px;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer;flex:1;min-width:56px;transition:border-color .15s,background .15s;user-select:none}
.badge-picker__item:hover{border-color:#a5b4fc;background:#f5f3ff}
.badge-picker__item input[type=radio]{width:14px;height:14px;accent-color:#6366f1;cursor:pointer;flex-shrink:0; border-radius: 50% !important;}
.badge-picker__item img{width:40px;height:40px;object-fit:contain}
.badge-picker__item:has(input[type=radio]:checked){border-color:#6366f1;background:#eef2ff}
.mv-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:36px 24px;border:2px dashed #c7d2fe;border-radius:14px;background:#f8fafc;cursor:pointer;transition:border-color .2s,background .2s;text-align:center;position:relative}
.mv-dropzone:hover{border-color:#6366f1;background:#eef2ff}
.mv-dropzone--selected{border-color:#6366f1;border-style:solid;background:#eef2ff}
.mv-dropzone__body{display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}
.mv-dropzone__icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:#e0e7ff;border-radius:50%;color:#6366f1;font-size:24px;margin-bottom:4px}
.mv-dropzone__icon--ok{background:#dcfce7;color:#16a34a}
.mv-dropzone__title{font-size:14px;font-weight:700;color:#1e293b}
.mv-dropzone__sub{font-size:12px;color:#94a3b8}
.mv-dropzone__input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
/* ── CourseLicensesPayment (clp-*) ──────────────────────────────────────── */
.clp-layout{display:grid;grid-template-columns:1fr;gap:20px;margin-bottom:20px}
@media(min-width:768px){.clp-layout{grid-template-columns:2fr 1fr;align-items:start}}
/* course detail card */
.clp-course-card{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden}
.clp-course-card__header{padding:14px 20px;border-bottom:1px solid #e2e8f0;background:#f8fafc}
.clp-course-card__title{font-size:15px;font-weight:700;color:#1e293b;margin:0;display:flex;align-items:center;gap:8px}
.clp-course-card__title i{color:#6366f1}
.clp-course-card__body{padding:20px}
.clp-course-meta{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:20px}
.clp-course-meta__thumb{width:130px;flex-shrink:0;border-radius:8px;overflow:hidden;background:#f1f5f9}
.clp-course-meta__thumb img{width:100%;height:auto;display:block}
.clp-course-meta__info{flex:1;min-width:0}
.clp-course-meta__row{font-size:13px;color:#475569;margin-bottom:6px;display:flex;align-items:baseline;gap:6px}
.clp-course-meta__row strong{color:#1e293b;font-weight:600;white-space:nowrap}
.clp-course-meta__desc{font-size:13px;color:#64748b;line-height:1.6}
/* payment card */
.clp-pay-card{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden}
.clp-pay-card__header{padding:14px 20px;background:linear-gradient(135deg,#6366f1,#4f46e5)}
.clp-pay-card__header-title{font-size:15px;font-weight:700;color:#fff;margin:0;display:flex;align-items:center;gap:8px}
.clp-pay-card__body{padding:20px;display:flex;flex-direction:column;gap:0}
/* license input */
.clp-input-group{margin-bottom:16px}
.clp-input-group label{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;display:block}
.clp-input-group .form-control{height:38px;border-radius:8px;border:1px solid #e2e8f0;font-size:13px;padding:0 12px;width:100%;box-shadow:none}
.clp-input-group .form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
/* price summary */
.clp-price-block{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden;margin-bottom:16px}
.clp-price-row{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #f1f5f9;font-size:13px}
.clp-price-row:last-child{border-bottom:none}
.clp-price-row__label{color:#64748b;font-weight:500}
.clp-price-row__value{color:#1e293b;font-weight:600;text-align:right}
.clp-price-row--total{background:#eef2ff}
.clp-price-row--total .clp-price-row__label{color:#4f46e5;font-weight:700}
.clp-price-row--total .clp-price-row__value{color:#4f46e5;font-size:14px;font-weight:800}
/* coupon */
.clp-coupon-section{margin-bottom:16px}
.clp-coupon-section__label{font-size:13px;font-weight:600;color:#374151;margin-bottom:8px;display:block}
.clp-coupon-group{display:flex;gap:8px}
.clp-coupon-group .form-control{flex:1;height:36px;border-radius:8px;border:1px solid #e2e8f0;font-size:13px;padding:0 10px;box-shadow:none}
.clp-coupon-group .form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
.clp-hint{font-size:11px;color:#94a3b8;margin-top:6px;line-height:1.5}
.clp-divider{height:1px;background:#e2e8f0;margin:16px 0}
/* payment mode */
.clp-payment-mode__label{font-size:12px;font-weight:700;color:#1e293b;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;display:block}
.clp-radio-option{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid #e2e8f0;border-radius:8px;margin-bottom:8px;cursor:pointer;font-size:13px;color:#334155;transition:border-color .15s,background .15s}
.clp-radio-option:hover{border-color:#c7d2fe;background:#f8f9ff}
.clp-radio-option input[type=radio]{accent-color:#6366f1;width:15px;height:15px}
/* credit card sub-form */
.clp-card-form{background:#f8fafc;border-radius:10px;padding:16px;border:1px solid #e2e8f0;margin-bottom:16px}
.clp-card-form__label{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;display:block}
.clp-card-form .form-control{height:36px;border-radius:8px;border:1px solid #e2e8f0;font-size:13px;padding:0 10px;width:100%;box-shadow:none}
.clp-card-form .form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
.clp-card-form__field{margin-bottom:12px}
.clp-expiry-row{display:flex;gap:10px}
.clp-expiry-row>div{flex:1}
/* pay actions */
.clp-pay-actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:16px;border-top:1px solid #e2e8f0}
/* search row inside thead */
.tbl-search-row th{background:#f8fafc;border-top:1px solid #e2e8f0;padding:10px 20px}
.tbl-search-row .form-control{height:34px;border-radius:8px;border:1px solid #e2e8f0;font-size:13px;padding:0 10px;width:100%;box-shadow:none;background:#fff}
.tbl-search-row .form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
/* points chip */
.tbl-pts-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;background:#fef3c7;border:1px solid #fde68a;border-radius:20px;font-size:12px;font-weight:700;color:#92400e}
.tbl-pts-chip i{font-size:11px;color:#d97706}
/* ── Export to Excel button ─────────────────────────────────────────────────── */
.ph-btn--excel{background:#fff;color:#16a34a!important;border:1px solid #86efac;box-shadow:none}
.ph-btn--excel:hover{background:#f0fdf4;border-color:#4ade80;color:#15803d!important;opacity:1}
.ph-btn--danger{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff!important;box-shadow:0 2px 8px rgba(239,68,68,.35)}
.ph-btn--danger:hover{box-shadow:0 6px 18px rgba(239,68,68,.45)}
/* ── Confirm dialog ──────────────────────────────────────────────────────── */
.mv-confirm-dialog{max-width:420px}
.mv-confirm-body{text-align:center;padding:8px 0 4px}
.mv-confirm-icon{width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:50%;margin:0 auto 16px;font-size:26px}
.mv-confirm-icon--indigo{background:#eef2ff;color:#6366f1}
.mv-confirm-icon--warn{background:#fef3c7;color:#d97706}
.mv-confirm-icon--danger{background:#fee2e2;color:#ef4444}
.mv-confirm-msg{font-size:15px;color:#1e293b;font-weight:600;margin:0 0 8px;line-height:1.4}
.mv-confirm-sub{font-size:13px;color:#64748b;margin:0}
/* ── mc-badge extra variants ─────────────────────────────────────────────── */
.mc-badge--success{background:#dcfce7;color:#15803d}
.mc-badge--danger{background:#fee2e2;color:#dc2626}
.mc-badge--info{background:#dbeafe;color:#1d4ed8}
/* ── Assign-course modal layout ──────────────────────────────────────────── */
.assign-layout{display:flex;gap:20px;margin-bottom:16px}
.assign-layout__filter{width:290px;flex-shrink:0;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px}
.assign-layout__filter-title{font-size:12px;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.05em;margin:0}
.assign-layout__form{flex:1;min-width:0;display:flex;flex-direction:column;gap:0}
.assign-layout__filter #dinamicLevels {
    width: 100%;
}
.assign-layout__filter .leveldynamic{display:flex;flex-direction:column;gap:6px; width: 100%;}
.assign-layout__filter .ph-btn{width:100%;justify-content:center}
.assign-add-level{font-size:12px;color:#6366f1;text-decoration:none;display:inline-flex;align-items:center;gap:4px;margin-top:4px}
.assign-add-level:hover{color:#4f46e5;text-decoration:none}
.assign-table-foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.assign-table-foot__licenses{font-size:13px;color:#64748b}
@media(max-width:639px){.assign-layout{flex-direction:column}.assign-layout__filter{width:100%}}
/* ── Portal Settings tab panel ──────────────────────────────────────────────── */
.portal-tab-panel{border-radius:16px;overflow:hidden;border:1px solid #e2e8f0;box-shadow:0 2px 12px rgba(0,0,0,.07);margin-bottom:24px}
.portal-tab-panel ul.nav.customize-tab{display:flex!important;flex-wrap:nowrap;gap:0;padding:0 16px;background:#f8fafc;border-bottom:2px solid #e2e8f0!important;margin:0;border-radius:0;list-style:none;overflow-x:clip}
.userCVtabs{
    padding: 0 !important;
}
.userCVtabs li a{
    padding: 10px 10px 12px !important;
}
.portal-tab-panel ul.nav.customize-tab>li{float:none;margin-bottom:-2px;flex-shrink:0}
.portal-tab-panel ul.nav.customize-tab>li>a{position:relative;border:none!important;border-radius:0!important;padding:16px 20px;color:#64748b;font-size:13px;font-weight:600;margin:0;background:transparent;transition:color .15s ease,background .15s ease;line-height:1.4;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;box-shadow:none!important}
.portal-tab-panel ul.nav.customize-tab>li>a::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:3px;background:transparent;transition:background .15s ease;border-radius:3px 3px 0 0}
.portal-tab-panel ul.nav.customize-tab>li>a i{font-size:12px;transition:color .15s}
.planDetailsTabs{
    padding: 0 !important;
    flex-wrap: wrap !important;
}
/* inactive icon colours per tab */
.portal-tab-panel ul.nav.customize-tab>li:nth-child(1)>a i{color:#a5b4fc}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(2)>a i{color:#7dd3fc}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(3)>a i{color:#c4b5fd}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(4)>a i{color:#6ee7b7}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(5)>a i{color:#fdba74}
/* hover */
.portal-tab-panel ul.nav.customize-tab>li>a:hover,.portal-tab-panel ul.nav.customize-tab>li>a:focus{outline:none;background:#f1f5f9!important}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(1)>a:hover{color:#6366f1!important}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(2)>a:hover{color:#0284c7!important}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(3)>a:hover{color:#7c3aed!important}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(4)>a:hover{color:#059669!important}
.portal-tab-panel ul.nav.customize-tab>li:nth-child(5)>a:hover{color:#ea580c!important}
/* active — white bg + coloured underline stripe */
.portal-tab-panel ul.nav.customize-tab>li.active>a,.portal-tab-panel ul.nav.customize-tab>li.active>a:hover,.portal-tab-panel ul.nav.customize-tab>li.active>a:focus{border:none!important;box-shadow:none!important;font-weight:700!important;font-size:14px!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(1)>a,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(1)>a:hover,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(1)>a:focus{background:#c7d2fe!important;color:#3730a3!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(1)>a::after{background:#6366f1}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(2)>a,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(2)>a:hover,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(2)>a:focus{background:#bae6fd!important;color:#075985!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(2)>a::after{background:#0ea5e9}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(3)>a,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(3)>a:hover,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(3)>a:focus{background:#ddd6fe!important;color:#4c1d95!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(3)>a::after{background:#8b5cf6}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(4)>a,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(4)>a:hover,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(4)>a:focus{background:#a7f3d0!important;color:#064e3b!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(4)>a::after{background:#10b981}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(5)>a,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(5)>a:hover,.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(5)>a:focus{background:#fed7aa!important;color:#9a3412!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(5)>a::after{background:#f97316}
/* active icon matches text color */
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(1)>a i{color:#3730a3!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(2)>a i{color:#075985!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(3)>a i{color:#4c1d95!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(4)>a i{color:#064e3b!important}
.portal-tab-panel ul.nav.customize-tab>li.active:nth-child(5)>a i{color:#9a3412!important}
.portal-tab-panel .my-tab-content{background:#fff;padding:24px 24px 16px}
.userCVtabcontent{
    background: transparent !important;
}
.portal-tab-panel__content{background:#fff}
/* ── jad-candidate-panel — QUALIFIED/DISQUALIFIED candidate list panel ───────
   several unscoped legacy rules (.tab-content{padding:20px}, .tab-content>
   .tab-pane{padding:1.25–1.5rem}, etc.) each add their own padding on top of
   .my-tab-content's, stacking to 60–70px of dead space around a list that's
   often just a handful of rows in this narrow column. Zero the redundant
   layers so the candidate list uses the panel's space instead of padding. */
   .jad-candidate-panel{
    height: stretch;
    margin-bottom: 0;
   }
.jad-candidate-panel .my-tab-content{padding:10px; height: stretch;}
.jad-candidate-panel .tab-content{padding:0;background:transparent;box-shadow:none;width:auto;float:none}
.jad-candidate-panel .tab-pane{padding:0}
.assign-subtab-nav{overflow-x:visible!important;position:relative;z-index:1}
.cfb-radio-group{display:flex;gap:16px;align-items:center;height:34px}
.cfb-radio-option{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:500;color:#334155;cursor:pointer;text-transform:none;letter-spacing:0;margin:0}
.cfb-radio-option input[type="radio"]{cursor:pointer;accent-color:#6366f1}
.displayInlineforMobileView{display:flex}
@media(max-width:600px){.displayInlineforMobileView{flex-direction:column!important}}
.gq-info-layout{display:flex;flex-wrap:wrap;gap:0}.gq-info-main{flex:0 0 66.666%;max-width:66.666%;padding-right:24px;display:flex;flex-direction:column;gap:14px}.gq-info-stats{flex:0 0 33.333%;max-width:33.333%;padding-left:24px;border-left:1px solid #e2e8f0}.gq-quiz-title{font-size:20px;font-weight:700;color:#1e293b;margin:0;display:flex;align-items:center;gap:10px;line-height:1.3}.gq-quiz-title__icon{width:36px;height:36px;border-radius:9px;background:linear-gradient(135deg,#6366f1,#8b5cf6);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:15px;flex-shrink:0}.gq-description{color:#64748b;font-size:13px;line-height:1.7;margin:0;padding:12px 14px;background:#f8fafc;border-radius:8px;border-left:3px solid #e2e8f0}.gq-actions{display:flex;flex-wrap:wrap;gap:8px;padding-top:14px;border-top:1px solid #f1f5f9}.gq-stat-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #f1f5f9}.gq-stat-item:last-child{border-bottom:none}.gq-stat-item__icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.gq-stat-item__icon--quizzes{background:#eef2ff;color:#6366f1}.gq-stat-item__icon--attempts{background:#ecfdf5;color:#059669}.gq-stat-item__icon--passing{background:#fffbeb;color:#b45309}.gq-stat-item__body{display:flex;flex-direction:column;gap:2px}.gq-stat-item__value{font-size:18px;font-weight:700;color:#1e293b;line-height:1}.gq-stat-item__label{font-size:11px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin-top:3px}

.gq-stat-item__icon--multi {
    background: #f6d7fe;
    color: #b409ab;
}

/* ── instrd-profile-card — instructor details sidebar ───────────────────── */
.instrd-profile-card {
    background: #fff;
    border-radius: 14px !important;
    box-shadow: 0 4px 20px rgba(15,23,42,.10);
    overflow: hidden;
    border: 1px solid #e2e8f0;
    margin-bottom: 16px
}
.instrd-profile-card__banner{height:72px;background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%)}
.instrd-profile-card__avatar-wrap{display:flex;justify-content:center;margin-top:-40px;padding:0 20px}
.instrd-profile-card__avatar{width:80px;height:80px;border-radius:50% !important;border:3px solid #fff;object-fit:cover;box-shadow:0 4px 12px rgba(15,23,42,.15)}
.instrd-profile-card__body{padding:10px 20px 20px;text-align:center}
.instrd-profile-card__name{font-size:16px;font-weight:700;color:#1e293b;margin:0 0 4px}
.instrd-profile-card__email{font-size:12px;color:#6366f1;font-weight:500;margin:0 0 14px;word-break:break-all}
.instrd-profile-card__divider{height:1px;background:#f1f5f9;margin:0 0 14px}
.instrd-profile-card__meta{display:flex;flex-direction:column;gap:8px;text-align:left}
.instrd-profile-card__row{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;color:#475569;padding:8px 12px;background:#f8fafc;border-radius:8px;border:1px solid #f1f5f9}
.instrd-profile-card__row i{color:#8b5cf6;font-size:13px;margin-top:1px;flex-shrink:0;width:14px;text-align:center}
.instrd-profile-card__row strong{color:#1e293b;margin-right:4px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;display:block;margin-bottom:1px}
.instrd-profile-card__row-content{display:flex;flex-direction:column}
/* ── assign-modal-note — info note in the assign employees modal ─────────── */
.assign-modal-note{font-size:12px;color:#475569;background:#eef2ff;border:1px solid #c7d2fe;border-radius:8px;padding:10px 12px;margin-bottom:16px;line-height:1.6;display:flex;align-items:flex-start;gap:8px}
.assign-modal-note i{color:#6366f1;font-size:13px;margin-top:2px;flex-shrink:0}
/* ── emp-profile-hero — employee profile page hero card ─────────────────── */
.emp-profile-hero{background:#fff;border-radius:14px;box-shadow:0 4px 20px rgba(15,23,42,.10);border:1px solid #e2e8f0;display:grid;grid-template-columns:240px 1fr;margin:0 0px 24px;overflow:hidden}
.emp-profile-hero__sidebar{background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);padding:32px 20px;display:flex;flex-direction:column;align-items:center;text-align:center}
.emp-profile-hero__avatar{width:88px;height:88px;border-radius:50%;background:rgba(255,255,255,.2);border:3px solid rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;font-size:38px;font-weight:300;color:#fff;margin-bottom:14px;overflow:hidden;flex-shrink:0}
.emp-profile-hero__avatar img{width:100%;height:100%;object-fit:cover}
.emp-profile-hero__name{font-size:17px;font-weight:700;color:#fff;margin:0 0 4px;line-height:1.3}
.emp-profile-hero__email{font-size:12px;color:rgba(255,255,255,.8);margin:0 0 14px;word-break:break-all}
.emp-profile-hero__status{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;background:rgba(255,255,255,.15);border-radius:20px;color:#fff;font-size:12px;font-weight:500}
.emp-profile-hero__status-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;flex-shrink:0}
.emp-profile-hero__info{display:grid;grid-template-columns:repeat(3,1fr)}
.emp-profile-hero__section{padding:20px;border-left:1px solid #f1f5f9;display:flex;flex-direction:column;gap:10px}
.emp-profile-hero__section-title{font-size:11px;font-weight:600;color:#64748b;display:flex;align-items:center;gap:6px;text-transform:uppercase;letter-spacing:.06em;padding-bottom:8px;border-bottom:1px solid #f1f5f9;margin-bottom:2px}
.emp-profile-hero__section-title i{color:#6366f1}
.emp-profile-hero__chips{display:flex;flex-wrap:wrap;gap:5px}
/* ── emp-layout — two-column sidebar + main layout ──────────────────────── */
.emp-layout{display:grid;grid-template-columns:260px 1fr;gap:24px;padding:0 0px 24px;align-items:start}
/* ── instrd-profile-card text-initial avatar variant ────────────────────── */
.instrd-profile-card__avatar-initial{width:80px;height:80px;border-radius:50%;background:#6366f1;color:#fff;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:300;border:3px solid #fff;box-shadow:0 4px 12px rgba(15,23,42,.15)}
/* ── emp-stat-grid + emp-stat-card ──────────────────────────────────────── */
.emp-stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:24px}
.emp-stat-card{background:#fff;border-radius:12px;padding:20px;display:flex;align-items:center;gap:16px;box-shadow:0 4px 20px rgba(15,23,42,.08);border:1px solid #e2e8f0}
.emp-stat-card__icon{width:48px;height:48px;border-radius:10px;background:#eef2ff;color:#6366f1;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.emp-stat-card__body{flex:1;min-width:0}
.emp-stat-card__value{font-size:22px;font-weight:700;color:#1e293b;display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:4px}
.emp-stat-card__tag{font-size:11px;font-weight:500;padding:2px 8px;border-radius:6px}
.emp-stat-card__tag--today{background:#eef2ff;color:#6366f1}
.emp-stat-card__tag--week{background:#f1f5f9;color:#64748b}
.emp-stat-card__label{font-size:13px;color:#64748b}
/* ── emp-chart-card — activity chart wrapper ─────────────────────────────── */
.emp-chart-card{background:#fff;border-radius:12px;box-shadow:0 4px 20px rgba(15,23,42,.08);border:1px solid #e2e8f0;margin-bottom:24px;overflow:hidden}
.emp-chart-card__head{padding:14px 20px;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#334155}
.emp-chart-card__head i{color:#6366f1}
.emp-chart-card__body{padding:0 20px 10px;overflow-x:auto}
/* ── emp-filter-bar — search + pill filter bar inside tabs ──────────────── */
.emp-filter-bar{display:flex;align-items:center;gap:12px;padding:14px 20px;flex-wrap:wrap;border-bottom:1px solid #f1f5f9}
.emp-filter-search{position:relative;flex:1;min-width:160px}
.emp-filter-search i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#94a3b8;pointer-events:none;font-size:12px}
.emp-filter-search input{width:100%;padding:8px 12px 8px 34px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;background:#f8fafc;color:#334155;outline:none;box-sizing:border-box}
.emp-filter-search input:focus{border-color:#6366f1;background:#fff}
.emp-filter-pills{display:flex;gap:6px;flex-wrap:wrap}
.emp-filter-pill{padding:5px 14px;background:#f1f5f9;border-radius:20px;font-size:12px;font-weight:500;color:#475569;cursor:pointer;border:1px solid transparent;transition:all .15s}
.emp-filter-pill:hover,.emp-filter-pill.active{background:#eef2ff;color:#6366f1;border-color:#c7d2fe}
/* ── emp-assign-header — instructor select row in Assignments tab ─────────── */
.emp-assign-header{display:flex;align-items:center;gap:16px;padding:14px 20px;border-bottom:1px solid #f1f5f9;flex-wrap:wrap;background:#fafafa}
.emp-assign-header label{font-size:13px;font-weight:500;color:#334155;flex:1;min-width:200px;margin:0}
.emp-assign-header select{border:1px solid #e2e8f0;border-radius:8px;padding:7px 12px;font-size:13px;color:#334155;background:#f8fafc;outline:none;min-width:200px}
/* ── mc-badge--warning variant ───────────────────────────────────────────── */
.mc-badge--warning{background:#fef3c7;color:#b45309}
/* ai-tab-panel placed after emp-layout gets matching horizontal margin */
.emp-layout + .ai-tab-panel{margin:0 0px 24px}
/* emp-* responsive */
@media(max-width:1024px){.emp-profile-hero{grid-template-columns:1fr;margin:0 16px 16px}.emp-profile-hero__info{grid-template-columns:1fr}.emp-profile-hero__section{border-left:none;border-top:1px solid #f1f5f9}.emp-layout{grid-template-columns:1fr;padding:0 16px 16px}.emp-stat-grid{grid-template-columns:1fr}}
@media(max-width:768px){.emp-profile-hero__avatar{width:72px;height:72px;font-size:30px}}


/* ============================================================
   Sidebar Menu: Enhanced Active States
   ============================================================ */

/* Baseline: left border placeholder (keeps layout stable) */
.page-sidebar-menu > li > a {
    border-left: 3px solid transparent !important;
    transition: background .15s ease, border-color .15s ease !important;
}

/* Active top-level — solid indigo, dark left accent, white text */
.page-sidebar-menu > li.active > a {
    background: #3f51b5 !important;
    border-left-color: #1a237e !important;
    color: #fff !important;
}
.page-sidebar-menu > li.active > a > i.icons {
    color: #fff !important;
    background: #3f51b5 !important;
}

/* Hover / open — preserve the existing blue, add left accent */
.page-sidebar-menu > li:not(.active) > a:hover,
.page-sidebar-menu > li.open:not(.active) > a {
    background: #2196F3 !important;
    border-left-color: #1565c0 !important;
    color: #fff !important;
}

.page-sidebar-menu > li:not(.active) > a:hover > i.icons,
.page-sidebar-menu > li.open:not(.active) > a > i.icons {
    color: #fff !important;
    background: #2196F3 !important;
}

/* Active sub-menu item */
.page-sidebar-menu > li > ul.sub-menu > li.active > a {
    background: rgba(0,0,0,.3) !important;
    border-left: 2px solid #90caf9 !important;
    color: #fff !important;
    font-weight: 500 !important;
}

/* Sub-menu hover */
.page-sidebar-menu > li > ul.sub-menu li > a:hover {
    background: rgba(0,0,0,.15) !important;
    color: #fff !important;
}

/* ============================================================
   Report menu: scrollable with sticky up/down arrow controls
   ============================================================ */

/* Cap height & hide native scrollbar */
ul.menu-report {
    max-height: 240px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}
ul.menu-report::-webkit-scrollbar {
    display: none !important;
}

/* Sticky arrow rows — always visible */
.report-scroll-ctrl {
    list-style: none !important;
    position: sticky !important;
    z-index: 6 !important;
    background: rgba(0, 0, 0, 0.55) !important;
    margin: 0 !important;
    padding: 0 !important;
}
.report-scroll-ctrl--up {
    top: 0 !important;
}
.report-scroll-ctrl--down {
    bottom: 0 !important;
}

/* Arrow link */
.report-scroll-ctrl > a {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    height: 26px !important;
    padding: 0 !important;
    color: rgba(255, 255, 255, 0.65) !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: background .15s, color .15s !important;
}
.report-scroll-ctrl > a:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #fff !important;
}

/* Override common.css display:none on sub-menu <i> elements */
.report-scroll-ctrl > a > i {
    display: inline-block !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

/* Disabled state — at scroll boundary */
.report-scroll-ctrl.is-disabled > a {
    opacity: .28 !important;
    pointer-events: none !important;
    cursor: default !important;
}

/* === Question Categories page === */
.ptp-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    padding: 4px 8px 0;
}
.ptp-filter-header .nav-tabs {
    border-bottom: none;
    margin-bottom: 0;
}
.qc-search-bar {
    display: flex;
    align-items: center;
    gap: 6px;
}
.qc-search-bar .form-control {
    width: 220px;
    height: 32px;
}
.qc-import-panel {
    padding: 8px 15px;
}
.qc-radio-group {
    display: flex;
    gap: 10px;
}
.qc-radio-label {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    width: fit-content;
    margin-bottom: 0;
}
.qc-file-input {
    color: #333;
}
.ques-cate-page .multiselect-parent.btn-group .dropdown-menu-form {
    overflow: auto !important;
    max-height: 130px;
    margin-left: -25px ;
}
.ques-cate-page .modal .multiselect-parent.btn-group .dropdown-toggle {
    margin-left: -25px;
}
.multiselect-parent.btn-group .dropdown-menu-form {
    overflow: auto !important;
    max-height: fit-content;
    position: unset !important;
    height: 250px !important;
}
.ques-cate-page .pagination > .active > a,
.ques-cate-page .pagination > .active > a:hover {
    z-index: 2;
    color: #000;
    cursor: default;
    background-color: #eee;
    border: 1px solid #ddd;
}

/* ── Import Questions panel (#demo) ─────────────────────────────────────── */
.imp-panel{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06);margin-bottom:20px;overflow:hidden}
.imp-panel__header{display:flex;align-items:center;gap:14px;padding:16px 20px;background:linear-gradient(135deg,#f8fafc 0%,#eef2ff 100%);border-bottom:1px solid #e2e8f0}
.imp-panel__header .fGrow{
    flex-grow: 1;
}
.imp-panel__header button{
    color:#94a3b8;
    font-size: 25px;
}

.imp-panel__icon{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:9px;flex-shrink:0}
.imp-panel__icon i{color:#fff;font-size:17px}
.imp-panel__title{font-size:14px;font-weight:700;color:#1e293b}
.imp-panel__subtitle{font-size:12px;color:#94a3b8;margin-top:2px}
.imp-panel__body{padding:20px 24px;display:flex;flex-direction:column;gap:20px}
.imp-panel__footer{padding:16px 24px;border-top:1px solid #f1f5f9;display:flex;flex-direction:column;gap:14px}
.imp-panel__actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* — Numbered steps ― */
.imp-step{display:flex;gap:14px;align-items:flex-start}
.imp-step__num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#6366f1;color:#fff;font-size:12px;font-weight:700;flex-shrink:0;margin-top:1px}
.imp-step__content{flex:1;min-width:0}
.imp-step__label{font-size:13px;font-weight:600;color:#374151;margin-bottom:10px;display:flex;align-items:center;gap:4px}
.imp-step__label .required-field{font-size:8px;color:#dc2626}

/* — Type selector ― */
.imp-type-group{display:flex;gap:10px;flex-wrap:wrap}
.imp-type-option{display:flex;align-items:center;gap:0;margin:0;cursor:pointer}
.imp-type-option input[type="radio"]{position:absolute;opacity:0;width:0;height:0}
.imp-type-option__label{display:inline-flex;align-items:center;gap:6px;padding:7px 18px;border-radius:50px;border:2px solid #e2e8f0;background:#f8fafc;color:#64748b;font-size:13px;font-weight:600;cursor:pointer;transition:border-color .18s,background .18s,color .18s}
.imp-type-option input[type="radio"]:checked + .imp-type-option__label{border-color:#6366f1;background:#eef2ff;color:#6366f1}
.imp-type-option__label:hover{border-color:#a5b4fc;color:#4f46e5}

/* — File dropzone ― */
.imp-dropzone{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:28px 20px;border:2px dashed #c7d2fe;border-radius:10px;background:#fafbff;cursor:pointer;transition:border-color .2s,background .2s;text-align:center}
.imp-dropzone:hover{border-color:#6366f1;background:#eef2ff}
.imp-dropzone__icon{font-size:28px;color:#a5b4fc}
.imp-dropzone__text{font-size:13px;font-weight:600;color:#4f46e5}
.imp-dropzone__formats{font-size:11px;color:#94a3b8;letter-spacing:.03em}
.imp-dropzone__input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}

/* — Validation ― */
.imp-validation{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:12px;color:#dc2626;font-weight:500}
.imp-validation i{font-size:13px}

/* — Progress bar ― */
.imp-progress{display:flex;flex-direction:column;gap:6px}
.imp-progress__label{font-size:12px;color:#475569;display:flex;align-items:center;gap:6px}
.imp-progress__label i{color:#6366f1}
.imp-progress__track{height:8px;border-radius:4px;background:#e2e8f0;margin:0}
.imp-progress__bar{background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:4px;transition:width .4s ease}

/* — Responsive ― */
@media (max-width:576px){
    .imp-panel__body{padding:16px}
    .imp-panel__footer{padding:12px 16px}
    .imp-type-group{gap:8px}
    .imp-type-option__label{padding:6px 14px;font-size:12px}
}

/* ── Question Categories — info callout (inline in header) ──────────────── */
.qc-info-callout--header{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin-top:5px;font-size:11px;color:#6366f1;line-height:1.5}
.qc-info-callout--header>i{font-size:11px;flex-shrink:0}
.qc-info-callout__steps{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px;color:#475569;font-size:11px}
.qc-info-callout__steps i{color:#c7d2fe;font-size:9px}
.qc-info-callout__steps strong{font-weight:600;color:#374151}
.qc-info-callout__hint{font-size:11px;color:#4f46e5}
.qc-info-callout__hint a{color:#4338ca;font-weight:600;text-decoration:underline}

/* ── Question Categories — tab search bar ────────────────────────────────── */
.qc-tab-search{display:flex;align-items:center;padding:7px;gap:7px;margin-left:auto}
.qc-tab-search .form-control{width:200px;height:32px;font-size:13px}
.qc-tab-search input{
    border-radius:6px !important;

}
.qc-tab-search button{
    height: stretch;
    border-radius:6px !important;
}
/* ── Question Categories — table ────────────────────────────────────────── */
.qc-table{margin-bottom:0}
.qc-table thead tr th{background:#f8fafc;color:#475569;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:10px 14px;border-bottom:2px solid #e2e8f0;white-space:nowrap}
.qc-table tbody tr{transition:background .15s}
.qc-table tbody tr:hover{background:#f8fafc}
.qc-table tbody td{padding:12px 14px;vertical-align:middle;border-bottom:1px solid #f1f5f9;font-size:13px;color:#334155}

/* ── Category name cell ──────────────────────────────────────────────────── */
.qc-cat-name{font-weight:600;color:#1e293b;font-size:13px;line-height:1.4}
.qc-cat-desc{font-size:12px;color:#94a3b8;margin-top:2px;line-height:1.4}
.qc-inline-edit{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:#6366f1;font-weight:600;margin-top:4px;cursor:pointer;text-decoration:none}
.qc-inline-edit:hover{color:#4f46e5;text-decoration:none}
.qc-inline-edit[disabled],.qc-inline-edit:disabled{opacity:.4;pointer-events:none}

/* ── Question count badge ────────────────────────────────────────────────── */
.qc-count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:22px;padding:0 7px;border-radius:11px;background:#eef2ff;color:#6366f1;font-size:12px;font-weight:700}
.qc-count-badge--zero{background:#fef2f2;color:#dc2626}

/* ── Skills pills ────────────────────────────────────────────────────────── */
.qc-skills{display:flex;flex-wrap:wrap;gap:4px}
.qc-skill-pill{display:inline-block;padding:2px 8px;border-radius:20px;background:#f1f5f9;color:#475569;font-size:11px;font-weight:500;border:1px solid #e2e8f0}
.qc-skill-empty{color:#cbd5e1;font-size:13px}

/* ── Action buttons row ──────────────────────────────────────────────────── */
.qc-actions{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.tbl-btn--add{color:#d97706;border-color:#fde68a}
.tbl-btn--add:hover{background:#fffbeb;border-color:#fcd34d;color:#b45309;text-decoration:none}

/* ── Responsive: stack actions on small screens ──────────────────────────── */
@media (max-width:768px){
    .qc-table thead{display:none}
    .qc-table tbody td{display:flex;justify-content:space-between;align-items:flex-start;padding:8px 12px;border-bottom:none}
    .qc-table tbody td::before{content:attr(data-label);font-weight:700;color:#64748b;font-size:11px;text-transform:uppercase;flex-shrink:0;margin-right:8px}
    .qc-table tbody tr{display:block;border:1px solid #e2e8f0;border-radius:10px;margin-bottom:12px;background:#fff}
    .qc-actions{flex-direction:row;flex-wrap:wrap}
    .qc-tab-search .form-control{width:140px}
    .ai-tab-panel__nav{flex-wrap:nowrap}
    .qc-tab-search{margin-left:0;width:100%}
}

/* ── Audio/Video Modal (#c-AudioVideo) ──────────────────────────────────── */
.av-modal-dialog{margin-top:60px}
.av-modal-body{padding:24px!important;display:flex;flex-direction:column;gap:20px}

/* — Info strip ― */
.av-info-strip{display:flex;align-items:flex-start;flex-wrap:wrap;gap:6px;background:#fefce8;border:1px solid #fde68a;border-radius:8px;padding:10px 14px;font-size:12px;color:#92400e;line-height:1.5}
.av-info-strip i{color:#d97706;font-size:13px;margin-top:1px;flex-shrink:0}
.av-info-strip__note{color:#b45309;font-weight:500}

/* — Steps wrapper ― */
.av-steps{display:flex;flex-direction:column;gap:18px}

/* — Uploader widget area ― */
.av-uploader-widget{min-height:48px;border:1px dashed #c7d2fe;border-radius:8px;background:#fafbff;padding:8px}
.av-hidden-input{display:none}

/* — File hints ― */
.av-file-hints{display:flex;flex-direction:column;gap:3px;margin-top:8px;font-size:11px;color:#94a3b8}
.av-file-hints span{display:flex;align-items:center;gap:5px}
.av-file-hints i{font-size:11px;color:#a5b4fc}

/* — Video preview ― */
.av-preview{margin-top:12px;border-radius:8px;overflow:hidden;background:#000}
.av-preview__video{width:100%;max-height:220px;display:block;border-radius:8px}

/* — File link ― */
.av-file-link{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:13px;color:#6366f1;font-weight:600;text-decoration:none}
.av-file-link:hover{color:#4f46e5;text-decoration:underline}

/* — Empty/warning state ― */
.av-empty-warning{display:flex;gap:14px;background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:16px}
.av-empty-warning__icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:#fef3c7;border-radius:8px;flex-shrink:0;color:#d97706;font-size:16px}
.av-empty-warning__body{display:flex;flex-direction:column;gap:8px}
.av-empty-warning__title{font-size:13px;font-weight:600;color:#92400e}
.av-empty-warning__types{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#b45309}
.av-empty-warning__types span{display:flex;align-items:center;gap:5px}
.av-empty-warning__link{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:#6366f1;text-decoration:none}
.av-empty-warning__link:hover{color:#4f46e5;text-decoration:underline}

/* ── Create Category Modal (#c-Category) ────────────────────────────────── */
.cat-modal-dialog{margin-top:60px}
.cat-modal-body{padding:24px!important;display:flex;flex-direction:column;gap:20px}
.cat-field-group{display:flex;flex-direction:column;gap:6px}
.cat-field-label{font-size:12px;font-weight:700;color:#374151;text-transform:uppercase;letter-spacing:.04em;display:flex;align-items:center;gap:4px;margin:0}
.cat-field-label .required-field{font-size:8px;color:#dc2626}
.cat-input{border:1px solid #e2e8f0!important;border-radius:8px!important;font-size:13px!important;color:#1e293b!important;padding:8px 12px!important;transition:border-color .18s,box-shadow .18s!important}
.cat-input:focus{border-color:#6366f1!important;box-shadow:0 0 0 3px rgba(99,102,241,.12)!important;outline:none!important}
.cat-textarea{min-height:90px;resize:vertical}
.cat-validation{display:flex;align-items:center;gap:5px;font-size:12px;color:#dc2626;font-weight:500;margin-top:2px}
.cat-validation i{font-size:12px}
.cat-entry-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:16px}

/* ── Map Category Modal (#c-MapCategory) ────────────────────────────────── */
.map-modal-dialog{margin-top:60px}
.map-modal-header{background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%)!important;border-radius:12px 12px 0 0!important;padding:20px 24px!important;border-bottom:none!important}
.map-modal-title-row{display:flex;align-items:center;gap:12px}
.map-modal-icon{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:rgba(255,255,255,.2);border-radius:8px;flex-shrink:0}
.map-modal-icon i{color:#fff;font-size:16px}
.map-modal-title{color:#fff!important;font-size:17px!important;font-weight:700!important;margin:0!important}
.map-modal-close{color:rgba(255,255,255,.8)!important;opacity:1!important;font-size:20px;line-height:1;margin-top:-2px}
.map-modal-close:hover{color:#fff!important}
.map-modal-body{padding:24px!important}

/* — Category summary card ― */
.map-cat-summary{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:16px 20px;margin-bottom:20px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.map-cat-summary__main{flex:1;min-width:0}
.map-cat-summary__name{font-size:16px;font-weight:700;color:#1e293b;line-height:1.3}
.map-cat-summary__desc{font-size:13px;color:#64748b;margin-top:4px;line-height:1.5}
.map-cat-summary__meta{display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.map-cat-summary__meta-item{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.map-cat-summary__meta-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#94a3b8}
.map-cat-summary__meta-link{font-size:12px}
.map-cat-summary__meta-link a{color:#6366f1;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.map-cat-summary__meta-link a:hover{color:#4f46e5;text-decoration:underline}

/* — Skills section ― */
.map-skills-section{background:#fff;border:1px solid #e2e8f0;border-radius:10px;overflow:hidden}
.map-skills-section__header{display:flex;align-items:flex-start;gap:12px;padding:14px 18px;background:#fafbff;border-bottom:1px solid #e2e8f0}
.map-skills-section__icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:6px;flex-shrink:0;margin-top:1px}
.map-skills-section__icon i{color:#fff;font-size:13px}
.map-skills-section__label{font-size:13px;font-weight:700;color:#1e293b}
.map-skills-section__hint{font-size:12px;color:#94a3b8;margin-top:2px;line-height:1.5}
.map-skills-section__multiselect{padding:14px 18px}
.map-skills-section__multiselect {
        height: auto !important;
    overflow: visible !important;
    min-height: 70px;
    max-height: fit-content;
}

.map-skills-section__multiselect .dropdown-menu.dropdown-menu-form{
    position: unset;
    margin: 0 0 10px  0 !important;
    max-height: fit-content !important;
}

.map-skills-section__multiselect .dropdown-toggle{
    margin: 0 !important;
}
/* — Footer ― */
.map-modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px!important}

/* — Responsive ― */
@media (max-width:600px){
    .map-cat-summary{flex-direction:column}
    .map-modal-footer{flex-direction:column-reverse}
    .map-modal-footer .btn{width:100%;justify-content:center}
}

/* ── Manage Curriculum Cards (mc-card) ───────────────────────────────────── */
.mc-card{background:#fff;border-radius:14px;border:1px solid #e2e8f0;box-shadow:0 2px 10px rgba(0,0,0,.06);margin-bottom:16px;display:flex;overflow:hidden;transition:box-shadow .2s,transform .2s;position:relative}
.mc-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#6366f1,#8b5cf6);border-radius:14px 0 0 14px;z-index:1}
.mc-card:hover{box-shadow:0 8px 28px rgba(99,102,241,.15);transform:translateY(-2px)}
.mc-card__thumb{width:160px;flex-shrink:0;background:#f1f5f9;overflow:hidden;min-height:150px}
.mc-card__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.mc-card__body{flex:1;padding:16px 20px 14px 20px;display:flex;flex-direction:column;gap:8px;min-width:0}
.mc-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.mc-card__title{font-size:15px;font-weight:700;color:#1e293b;margin:0;line-height:1.4}
.mc-card__title a{color:#1e293b;text-decoration:none}
.mc-card__title a:hover{color:#6366f1;text-decoration:none}
.mc-card__badge-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex-shrink:0}
.mc-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.mc-badge.assessDetailsbadge svg{
height: 11px;
width: 11px;
}
.mc-badgeNew{
    line-height:1.2;
}
.uinfo-card__value .mc-badge{padding: 0;}
.mc-badge--published{background:#dcfce7;color:#15803d}
.mc-badge--published svg{
    height: 14px;
    width: 14px;
}
.mc-badge--draft{background:#fef3c7;color:#b45309}
.mc-toggle-wrap{display:flex;align-items:center;gap:6px}
.mc-toggle-wrap .ats-switch{border-radius:999px;min-width:54px;border-color:#c7d2fe;margin-left:0;margin-bottom:0;box-shadow:none;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease}
.mc-toggle-wrap .ats-switch:hover{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12)}
.mc-toggle-wrap .ats-switch .switch-left,.mc-toggle-wrap .ats-switch .switch-right,.mc-toggle-wrap .ats-switch .knob{min-height:22px;font-size:9px;padding:3px 5px;line-height:16px}
.mc-toggle-wrap .ats-switch .switch-left{background:#6366f1;color:#fff}
.mc-toggle-wrap .ats-switch .switch-right{background:#f1f5f9;color:#94a3b8}
.mc-toggle-wrap .ats-switch .knob{background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.mc-card__chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.mc-chip{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    background: #f8fafc;
    border: 1px solid #DCE2E4FF;
    border-radius: 999px !important;
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
    letter-spacing: .01em;
    transition: box-shadow .15s ease;
    line-height: 1.2;
}
.mc-chip--text{
        display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    background: #ffffff;
    border: 1px solid #DCE2E4FF;
    border-radius: 5px !important;
    font-size: 12px;
    color: #525b6a;
    font-weight: 500;
    letter-spacing: .01em;
    transition: box-shadow .15s ease;
    line-height: 1.2;
}
.mc-chip i{font-size:11px;opacity:.75}
.mc-chip svg{height:11px;width: 11px;}
.mc-chip--cat{
    /* background:linear-gradient(135deg,#f3f0ff,#ede9fe);border-color:rgba(167,139,250,.4);color:#6d28d9; */
        background: #E7E5EF4D;
    border-color: #E7E5EF66;
    color: #586367;
}
.mc-chip--cat i{opacity:1;color:#586367}
.mc-chip--date{background:linear-gradient(135deg,#e0f7ff,#e0f2fe);border-color:rgba(125,211,252,.5);color:#0369a1}
.mc-chip--date i{opacity:1;color:#0284c7}
.mc-chip--price{
        background: #fff;
    border-color: #DCE2E4FF;
    color: #636363;
    border-radius: 10px !important;
}
.lstMeta2{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 7px;
}
.appVacancies{
    border-radius: 10px !important;
    /* align-items: flex-start; */
}
.appVacancies i{
    font-size: 14px;
}
.appVacancies span{
    display: flex;
    flex-direction: column-reverse;
    gap: 3px;
}
.vacaNo{
        color: #484848;
    font-size: 15px;
}

.mc-chip--multi {
    background: #f6d7fe;
    color: #b409ab;
}
.mc-chip--batch{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:rgba(252,211,77,.5);color:#b45309}
.mc-chip--batch i{opacity:1;color:#d97706}
.mc-card__upcoming{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#4f46e5;font-weight:600;background:#eef2ff;padding:5px 12px;border-radius:8px;align-self:flex-start}
.mc-card__upcoming i{color:#818cf8}
.mc-card__desc{font-size:13px;color:#64748b;line-height:1.6}
.mc-card__desc,
.mc-card__desc * {
    font-size: 13px !important;
    color: #64748b;
    line-height: 1.2;
}
.mc-card__desc .collapse{
    visibility: visible;
     overflow: hidden;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: auto !important;
}
.readMoreBtn{
        text-decoration: underline;
    color: #4863d2;
}
.readMoreBtn:hover{
    text-decoration: underline;
    color: #4863d2;
}
.mc-card__actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding-top:10px;border-top:1px solid #f1f5f9;margin-top:auto}
.mc-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 15px;border-radius:999px;font-size:12px;font-weight:600;text-decoration:none;cursor:pointer;border:1.5px solid transparent;background:#fff;transition:background .15s ease,border-color .15s ease,box-shadow .2s ease,transform .15s ease;line-height:1.4;white-space:nowrap;}
.mc-btn:hover{text-decoration:none;transform:translateY(-1px)}
.mc-btn .fa{font-size:13px}
.mc-btn svg{width:13px;height:13px}
/* compact — fit two actions on one row */
.mc-btn--sm{padding:4px 10px;font-size:11px;gap:4px}
.mc-btn--sm .fa{font-size:11px}
.mc-btn--sm svg{width:12px;height:12px}
/* indigo — view */
.mc-btn--view{color:#6366f1!important;border-color:#c7d2fe}
.mc-btn--view .fa{color:#6366f1}
.mc-btn--view:hover{background:#eef2ff;border-color:#a5b4fc;box-shadow:0 2px 10px rgba(99,102,241,.18)}
/* emerald — publish */
.mc-btn--publish{color:#059669!important;border-color:#6ee7b7 !important;}
.mc-btn--publish .fa{color:#059669}
.mc-btn--publish:hover{background:#d1fae5;border-color:#34d399;box-shadow:0 2px 10px rgba(5,150,105,.18)}
/* amber — unpublish */
.mc-btn--unpublish{color:#d97706!important;border-color:#fcd34d}
.mc-btn--unpublish .fa{color:#d97706}
.mc-btn--unpublish:hover{background:#fef3c7;border-color:#fbbf24;box-shadow:0 2px 10px rgba(217,119,6,.18)}
/* sky — assign */
.mc-btn--assign{color:#0284c7!important;border-color:#7dd3fc}
.mc-btn--assign .fa{color:#0284c7}
.mc-btn--assign:hover{background:#e0f2fe;border-color:#38bdf8;box-shadow:0 2px 10px rgba(2,132,199,.18)}
/* violet — buy */
.mc-btn--buy{color:#7c3aed!important;border-color:#c4b5fd !important;}
.mc-btn--buy .fa{color:#7c3aed}
.mc-btn--buy:hover{background:#ede9fe;border-color:#a78bfa;box-shadow:0 2px 10px rgba(124,58,237,.18)}
/* teal — translate */
.mc-btn--translate{color:#0d9488!important;border-color:#5eead4}
.mc-btn--translate .fa{color:#0d9488}
.mc-btn--translate:hover{background:#ccfbf1;border-color:#2dd4bf;box-shadow:0 2px 10px rgba(13,148,136,.18)}
/* orange — request */
.mc-btn--request{color:#ea580c!important;border-color:#fdba74 !important;}
.mc-btn--request .fa{color:#ea580c}
.mc-btn--request:hover{background:#ffedd5;border-color:#fb923c;box-shadow:0 2px 10px rgba(234,88,12,.18)}
/* pink — community */
.mc-btn--community{color:#db2777!important;border-color:#f9a8d4 !important;}
.mc-btn--community .fa{color:#db2777}
.mc-btn--community:hover{background:#fce7f3;border-color:#f472b6;box-shadow:0 2px 10px rgba(219,39,119,.18)}
/* disabled state — any mc-btn */
.mc-btn--disabled{opacity:.5;pointer-events:none;cursor:not-allowed}
/* red — delete */
.mc-btn--delete{color:#dc2626!important;border-color:#fca5a5}
.mc-btn--delete .fa{color:#dc2626}
.mc-btn--delete:hover{background:#fee2e2;border-color:#f87171;box-shadow:0 2px 10px rgba(220,38,38,.18)}
/* gray — requested (disabled) */
.mc-btn--requested{color:#94a3b8!important;border-color:#e2e8f0;cursor:default;pointer-events:none}
/* ── Course Type Picker ───────────────────────────────────────────────────── */
.course-type-picker{display:flex;flex-wrap:wrap;gap:12px;padding:16px 0 8px;justify-content:center}
.course-type-option{display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 22px;background:#fff;border:1.5px solid #e2e8f0;border-radius:12px;min-width:148px;text-decoration:none!important;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s;color:#334155!important}
.course-type-option:hover{border-color:#6366f1;box-shadow:0 4px 16px rgba(99,102,241,.15);transform:translateY(-2px);text-decoration:none!important;color:#334155!important}
.course-type-option__icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#eef2ff;border-radius:10px;color:#6366f1;font-size:20px;flex-shrink:0}
.course-type-option__title{font-size:13px;font-weight:700;color:#1e293b;text-align:center;line-height:1.3}
.course-type-option__desc{
        font-size: 12px;
    color: #6a7585;
    text-align: center;
    line-height: 1.4;
    letter-spacing: normal;
        font-weight: 500;
}

@media(max-width:768px){
  .mc-card{flex-direction:column}
  .mc-card__thumb{width:100%;height:180px;min-height:0}
  .mc-card::before{width:100%;height:4px;left:0;top:0;right:0;bottom:auto;border-radius:14px 14px 0 0}
}

/* ── Student List — Misc ─────────────────────────────────────────────────── */
.tbl-avatar{height:36px;width:36px;border-radius:50% !important;object-fit:cover;flex-shrink:0;border:2px solid #e2e8f0}
.invalidrow{background-color:#e68f8c!important;color:#fff!important}

/* ── Student List — Offcanvas ────────────────────────────────────────────── */
.offcanvas{position:fixed;top:0;right:-400px;width:400px;height:100%;background:#fff;box-shadow:-4px 0 24px rgba(15,23,42,.12);transition:right .3s ease-in-out;z-index:9999}
.offcanvas.show{right:0}
.offcanvas-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(15,23,42,.45);z-index:9998;display:none}
.offcanvas-overlay.show{display:block}
body.offcanvas-open{overflow:hidden}
.offcanHead{display:flex;justify-content:space-between;align-items:center;padding:0 20px;border-bottom:1px solid #e2e8f0;position:sticky;top:0;background:#fff;z-index:10;height:60px}
.offcanHead div{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:#1e293b}
.offcan-head-icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;background:#eef2ff;border-radius:8px;color:#6366f1;font-size:13px;flex-shrink:0}
.offcanHead .offcanClose{font-size:22px;color:#94a3b8;cursor:pointer;line-height:1;transition:color .15s}
.offcanHead .offcanClose:hover{color:#1e293b}
.offCanBody{padding:0;background:#fff;height:calc(100% - 120px);overflow-y:auto}
.offcanFooter{display:flex;justify-content:space-between;align-items:center;padding:0 20px;border-top:1px solid #e2e8f0;position:sticky;bottom:0;background:#fff;z-index:10;height:64px}
/* offcanvas profile card */
.offcan-profile{display:flex;align-items:center;gap:14px;padding:16px 20px;background:#f8fafc;border-bottom:1px solid #e2e8f0}
.offcan-profile__avatar{width:52px;height:52px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid #e2e8f0}
.offcan-profile__name{font-size:14px;font-weight:700;color:#1e293b;line-height:1.3}
.offcan-profile__email{font-size:12px;color:#64748b;margin-top:2px}
.offcan-profile__status{margin-top:5px}
/* offcanvas contact & photo section */
.offcan-photo-row{display:flex;align-items:center;gap:12px;margin-top:2px}
.offcan-photo-current{width:60px;height:60px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid #e2e8f0}
.offcan-upload-zone{flex:1;padding:10px 12px}
.offcan-upload-zone i{font-size:18px}
.offcan-photo-preview{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid #6366f1;margin-top:8px;display:block}
.reqText{font-size:12px;color:#94a3b8;margin-bottom:12px}
.reqText span{color:#dc2626}
.editLabel{font-size:13px;font-weight:500;color:#1e293b}
.informgrp{margin-bottom:16px}
.inpText{padding:8px 12px;border-radius:6px;border:1px solid #e2e8f0;font-size:14px;width:100%}
.closeOfcan{background:#fff;color:#1e293b;border:1px solid #e2e8f0;padding:8px 16px;border-radius:8px;font-weight:500;font-size:13px;cursor:pointer;text-decoration:none}
.updateInfo{background:#6366f1;color:#fff;border:1px solid #6366f1;padding:8px 16px;border-radius:8px;font-weight:500;font-size:13px;cursor:pointer;text-decoration:none;margin-left:8px}
/* ── Upload Content Form ─────────────────────────────────────────────────── */
.mv-upload-pane{padding:20px 0}
.mv-upload-grid{display:flex;gap:24px;align-items:flex-start}
.mv-upload-grid__fields{flex:1;min-width:0}
.mv-upload-grid__info{width:280px;flex-shrink:0}
.mv-upload-grid__actions{display:flex;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid #e2e8f0}
.mv-form-label{font-size:13px;font-weight:600;color:#374151;margin-bottom:6px;display:block}
.mv-upload-permissions{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.mv-permission-item{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#475569;cursor:pointer;margin:0}
.mv-permission-item input[type="checkbox"]{width:15px;height:15px;accent-color:#6366f1;cursor:pointer;flex-shrink:0}
.mv-formats-card{background:#eef2ff;border:1px solid #c7d2fe;border-radius:10px;padding:16px;position:sticky;top:16px}
.mv-formats-card__title{font-size:13px;font-weight:700;color:#3730a3;margin-bottom:12px;display:flex;align-items:center;gap:6px}
.mv-formats-card__item{font-size:12px;font-weight:600;color:#1e293b;margin-bottom:4px}
.mv-formats-card__size{font-size:11px;font-weight:400;color:#64748b;margin-left:4px}
.mv-formats-card__tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.mv-fmt-tag{display:inline-flex;align-items:center;padding:2px 8px;background:#e0e7ff;color:#4338ca;border-radius:4px;font-size:11px;font-weight:600}
@media(max-width:992px){
  .mv-upload-grid{flex-direction:column}
  .mv-upload-grid__info{width:100%}
}
/* ── My Files content list ───────────────────────────────────────────────── */
.mv-content-item{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #f1f5f9;transition:background .15s}
.mv-content-item:last-child{border-bottom:none}
.mv-content-item:hover{background:#f8fafc}
.mv-content-item__main{display:flex;flex-direction:column;gap:4px;min-width:0}
.mv-content-item__title{font-size:13px;font-weight:600;color:#3730a3;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.mv-content-item__title:hover{color:#4f46e5;text-decoration:underline}
.mv-content-item__meta{font-size:12px;color:#64748b;display:inline-flex;align-items:center;gap:4px;flex-wrap:wrap}
.mv-content-item__desc{font-size:12px;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:480px}
.mv-content-item__actions{flex-shrink:0}
/* === Package Payment Page (pkg-) === */
.pkg-invoice{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);margin-bottom:24px;overflow:hidden}
.pkg-invoice__header{padding:14px 24px;background:linear-gradient(135deg,#6366f1,#4f46e5);display:flex;align-items:center;justify-content:space-between}
.pkg-invoice__title{font-size:14px;font-weight:700;color:#fff;margin:0;display:flex;align-items:center;gap:8px}
.pkg-invoice__id{font-size:13px;color:rgba(255,255,255,.85);font-weight:500;letter-spacing:.02em}
.pkg-invoice__body{display:flex;flex-wrap:wrap}
.pkg-invoice__panel{flex:1;min-width:200px;padding:20px 24px;border-right:1px solid #e2e8f0}
.pkg-invoice__panel:last-child{border-right:none}
.pkg-invoice__panel-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#6366f1;margin:0 0 14px 0;display:flex;align-items:center;gap:6px}
.pkg-info-row{margin-bottom:10px}
.pkg-info-row__label{font-size:11px;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px;display:block}
.pkg-info-row__value{font-size:13px;color:#1e293b;font-weight:500;display:block;line-height:1.4}
.pkg-total-row{background:#f0fdf4;border-radius:8px;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;margin-top:14px;border:1px solid #bbf7d0}
.pkg-total-row__label{font-size:12px;font-weight:700;color:#166534}
.pkg-total-row__value{font-size:16px;font-weight:800;color:#15803d}
/* === Search Certificate (cert-) === */
.cert-layout{display:flex;flex-wrap:wrap;gap:20px;margin-top:4px}
.cert-search-panel{width:300px;flex-shrink:0}
.cert-results-panel{flex:1;min-width:0}
.cert-search-card{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden}
.cert-search-card__header{padding:14px 20px;background:linear-gradient(135deg,#6366f1,#4f46e5)}
.cert-search-card__header-title{font-size:14px;font-weight:700;color:#fff;margin:0;display:flex;align-items:center;gap:8px}
.cert-search-card__body{padding:20px}
.cert-search-card__subtitle{font-size:13px;font-weight:600;color:#1e293b;margin:0 0 6px}
.cert-search-card__desc{font-size:12px;color:#64748b;margin:0 0 18px;line-height:1.6}
.cert-field{margin-bottom:14px}
.cert-field__label{font-size:11px;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;display:block}
.cert-field .form-control{height:36px;border-radius:8px;border:1px solid #e2e8f0;font-size:13px;padding:0 10px;width:100%;box-shadow:none}
.cert-field .form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
.cert-field__note{font-size:11px;color:#94a3b8;margin-top:5px;font-style:italic;display:block}
.cert-empty{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:48px 24px;gap:12px;min-height:320px}
.cert-empty img{height:160px;width:auto;object-fit:contain;opacity:.65}
.cert-empty__title{font-size:16px;font-weight:600;color:#374151;margin:0;text-align:center}
.cert-empty__sub{font-size:13px;color:#94a3b8;margin:0;text-align:center}
.cert-result{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);overflow:hidden}
.cert-result__header{padding:14px 20px;background:linear-gradient(135deg,#6366f1,#4f46e5);display:flex;align-items:center;justify-content:space-between}
.cert-result__header-title{font-size:14px;font-weight:700;color:#fff;margin:0;display:flex;align-items:center;gap:8px}
.cert-status{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase}
.cert-status--active{background:rgba(74,222,128,.25);color:#00ff3a;}
.cert-status--inactive{background: #01001445;color: #ff0000;}
.cert-result__body{padding:24px}
.cert-meta{display:flex;gap:20px;align-items:flex-start;margin-bottom:20px}
.cert-meta__info{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.cert-meta__qr{display:flex;flex-direction:column;align-items:center;gap:8px;flex-shrink:0}
.cert-meta__qr img{border:1px solid #e2e8f0;padding:6px;border-radius:8px;width:104px;height:104px;object-fit:contain}
.cert-row{margin-bottom:12px}
.cert-row__label{font-size:11px;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px;display:block}
.cert-row__value{font-size:13px;color:#1e293b;font-weight:500;display:block;line-height:1.4}
.cert-row__value--expiry{color:#dc2626!important;font-weight:600}
/* ── Library modal form (c-library) ─────────────────────────────────────── */
.mv-form-notice{font-size:12px;color:#64748b;margin-bottom:20px;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.mv-form-notice .fa-star{color:#dc2626;font-size:9px;vertical-align:middle}
.mv-doc-dropzone{position:relative;border:2px dashed #cbd5e1;border-radius:10px;padding:28px 16px;text-align:center;background:#f8fafc;transition:border-color .2s,background .2s;cursor:pointer;overflow:hidden}
.mv-doc-dropzone:hover{border-color:#6366f1;background:#eef2ff}
.mv-doc-dropzone__icon{font-size:30px;color:#94a3b8;display:block;margin-bottom:8px;pointer-events:none;transition:color .2s}
.mv-doc-dropzone:hover .mv-doc-dropzone__icon{color:#6366f1}
.mv-doc-dropzone__text{font-size:13px;color:#64748b;pointer-events:none;font-weight:500;letter-spacing:.03em}
.mv-doc-dropzone__input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;width:100%;height:100%;cursor:pointer}
.mv-doc-dropzone__meta{margin-top:8px;font-size:12px;color:#475569;background:#f1f5f9;border-radius:6px;padding:7px 12px;display:flex;align-items:center;gap:6px}
.mv-doc-progress{margin-top:10px;display:flex;align-items:center;gap:10px}
.mv-doc-progress .progress{flex:1;margin:0;height:8px;border-radius:4px;overflow:hidden;background:#e2e8f0;box-shadow:none}
.mv-doc-progress .progress-bar{background:#6366f1;border-radius:4px;transition:width .3s ease}
.mv-doc-progress__pct{font-size:12px;color:#6366f1;font-weight:700;white-space:nowrap}
.mv-modal__body .form-control{border-radius:8px;border:1px solid #e2e8f0;font-size:13px;box-shadow:none;transition:border-color .2s,box-shadow .2s}
.mv-modal__body .form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12);outline:none}
.mv-modal__body textarea.form-control{resize:vertical}
.mv-modal__body .mv-form-label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#374151;margin-bottom:6px; letter-spacing: normal;}
.mv-modal__body .mv-form-label svg{
    height: 17px;
    width: 17px;
}
.mv-modal__body .mv-form-label .fa{color:#6366f1;font-size:12px}
.mv-modal__body .mv-form-label .required-field{margin-left:auto}
.mv-modal__body .mv-form-label .required-field .fa-star{color:#dc2626;font-size:9px}
/* ── Assign Course/Curriculum modal (c-libCourse) ───────────────────────── */
.mv-assign-type{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.mv-assign-type__option{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border:1.5px solid #e2e8f0;border-radius:8px;font-size:13px;font-weight:500;color:#64748b;cursor:pointer;transition:border-color .2s,background .2s,color .2s;margin:0;background:#fff;user-select:none}
.mv-assign-type__option input[type="radio"]{display:none}
.mv-assign-type__option .fa{font-size:13px;color:#94a3b8;transition:color .2s}
.mv-assign-type__option:hover{border-color:#6366f1;color:#4f46e5;background:#eef2ff}
.mv-assign-type__option:hover .fa{color:#6366f1}
.mv-assign-type__option--active{border-color:#6366f1;background:#eef2ff;color:#4338ca;font-weight:600}
.mv-assign-type__option--active .fa{color:#6366f1}
.lc-check-col{width:160px}
.lc-empty-row td{text-align:center;padding:20px 16px;color:#94a3b8;font-size:13px}
.lc-empty-row .fa{font-size:18px;margin-right:6px;color:#cbd5e1;vertical-align:middle}
/* ── Form field hint (below inputs) ─────────────────────────────────────── */
.mv-field-hint{font-size:12px;color:#64748b;margin-top:5px;display:flex;align-items:center;gap:5px;font-style:italic}
.mv-field-hint .fa{color:#94a3b8;font-size:11px}
/* ── Library unified tab panel actions bar ───────────────────────────────── */
.lib-tab-actions{display:flex;justify-content:flex-end;margin-bottom:14px}
.cert-row--wide{grid-column:1/-1}
.cert-skills{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.cert-skills span{display:inline-block;padding:2px 10px;background:#eef2ff;color:#4f46e5;border-radius:20px;font-size:11px;font-weight:600}
.cert-body{border-top:1px solid #e2e8f0;margin-top:4px;padding-top:20px}
.cert-body__label{font-size:11px;font-weight:700;text-transform:uppercase;color:#94a3b8;letter-spacing:.04em;margin-bottom:12px;display:block}
.cert-body__img{width:100%;height:auto;border-radius:8px;border:1px solid #e2e8f0}
/* === lst-grid filter row (smart-table column search inputs) === */
.lst-grid > table thead tr.lst-filter-row th{padding:5px 8px;background:#fff;border-bottom:1px solid #e2e8f0}
.lst-grid > table thead tr.lst-filter-row input[type="search"]{height:28px;border-radius:6px;border:1px solid #e2e8f0;font-size:12px;padding:0 8px;width:100%;box-shadow:none;outline:none;background:#f8fafc;color:#1e293b}
.lst-grid > table thead tr.lst-filter-row input[type="search"]:focus{border-color:#6366f1;box-shadow:0 0 0 2px rgba(99,102,241,.1);background:#fff}
.lst-grid > table thead tr.lst-filter-row input[type="search"]::placeholder{color:#94a3b8}
/* === Client Dashboard: KPI Stat Cards === */
.db-kpi-row{display:flex;flex-wrap:wrap;gap:14px;padding:0 0 20px}
.db-kpi-card{flex:1;min-width:140px;background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(15,23,42,.08);padding:18px 20px;display:flex;align-items:center;gap:14px;border:1px solid #e2e8f0}
.db-kpi-icon{width:46px;height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;color:#fff;flex-shrink:0}
.db-kpi-icon--indigo{background:linear-gradient(135deg,#6366f1,#818cf8)}
.db-kpi-icon--green{background:linear-gradient(135deg,#10b981,#34d399)}
.db-kpi-icon--amber{background:linear-gradient(135deg,#f59e0b,#fbbf24)}
.db-kpi-icon--rose{background:linear-gradient(135deg,#f43f5e,#fb7185)}
.db-kpi-body{display:flex;flex-direction:column;min-width:0}
.db-kpi-label{font-size:10px;color:#64748b;text-transform:uppercase;letter-spacing:.6px;font-weight:700}
.db-kpi-value{font-size:26px;font-weight:800;color:#1e293b;line-height:1.1}
.db-kpi-sub{font-size:11px;color:#94a3b8;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* === Client Dashboard: Activity Sidebar Stats === */
.db-stat-group{padding:10px 0}
.db-stat-group+.db-stat-group{border-top:1px solid #f1f5f9;padding-top:14px;margin-top:4px}
.db-stat-group__title{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.4px;margin-bottom:10px}
.db-stat-group__title i{color:#6366f1}
.db-stat-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.db-stat-row__label{font-size:12px;color:#64748b}
.db-stat-row__value{font-size:13px;font-weight:700;color:#1e293b;background:#eef2ff;color:#4f46e5;padding:2px 10px;border-radius:20px}

/* === Client Dashboard: Announcement Feed === */
.db-announce-list{list-style:none;padding:0;margin:0}
.db-announce-item{display:flex;align-items:flex-start;gap:10px;padding:12px 0;border-bottom:1px solid #f8fafc}
.db-announce-item:last-child{border-bottom:none;padding-bottom:0}
.db-announce-icon{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#fef3c7,#fde68a);display:flex;align-items:center;justify-content:center;font-size:13px;color:#d97706;flex-shrink:0;margin-top:2px}
.db-announce-body{flex:1;min-width:0}
.db-announce-date{font-size:10px;color:#94a3b8;font-weight:600;letter-spacing:.3px;margin-bottom:3px;text-transform:uppercase}
.db-announce-text{font-size:13px;color:#334155;line-height:1.5}
.db-announce-actions{display:flex;gap:5px;margin-top:7px}

/* === Client Dashboard: Leaderboard === */
.db-lb-title{font-size:11px;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;gap:6px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid #f1f5f9}
.db-lb-title i{color:#f59e0b}
.db-leaderboard{list-style:none;padding:0;margin:0}
.db-leaderboard__item{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #f8fafc}
.db-leaderboard__item:last-child{border-bottom:none;padding-bottom:0}
.db-leaderboard__rank{width:26px;height:26px;border-radius:50%;background:#f1f5f9;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#64748b;flex-shrink:0}
.db-leaderboard__rank--1{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff}
.db-leaderboard__rank--2{background:linear-gradient(135deg,#94a3b8,#64748b);color:#fff}
.db-leaderboard__rank--3{background:linear-gradient(135deg,#cd9469,#b45309);color:#fff}
.db-leaderboard__avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;border:2px solid #e2e8f0;flex-shrink:0}
.db-leaderboard__name{font-size:13px;font-weight:600;color:#1e293b;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db-leaderboard__points{display:flex;align-items:center;gap:3px;font-size:12px;font-weight:700;color:#f59e0b;flex-shrink:0}
.db-leaderboard__points i{font-size:10px}

/* === Client Dashboard: Popular Courses === */
.db-course-list{list-style:none;padding:0;margin:0}
.db-course-item{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #f8fafc}
.db-course-item:last-child{border-bottom:none;padding-bottom:0}
.db-course-thumb{width:50px;height:50px;border-radius:8px;object-fit:cover;border:1px solid #e2e8f0;flex-shrink:0}
.db-course-body{flex:1;min-width:0}
.db-course-title{font-size:13px;font-weight:600;color:#1e293b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db-course-enrolled{font-size:11px;color:#64748b;margin-top:3px;display:flex;align-items:center;gap:3px}
.db-course-enrolled span{color:#6366f1;font-weight:700;font-size:13px}
.db-course-enrolled .fa-arrow-up{color:#10b981}
.db-course-enrolled .fa-arrow-down{color:#f43f5e}
.db-course-actions{flex-shrink:0}

/* === Client Dashboard: Assessment / Quiz Feed === */
.db-assess-list{list-style:none;padding:0;margin:0}
.db-assess-item{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #f8fafc}
.db-assess-item:last-child{border-bottom:none;padding-bottom:0}
.db-assess-avatar{width:40px;height:40px;border-radius:98% !important;object-fit:cover;flex-shrink:0}
.db-assess-avatar--complete{box-shadow:0 0 0 2px #10b981; border-radius: 98% !important}
.db-assess-view-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;background:#eef2ff;color:#6366f1;border:none;cursor:pointer;flex-shrink:0;text-decoration:none;font-size:13px;transition:background .15s,color .15s}
.db-assess-view-btn:hover{background:#6366f1;color:#fff;text-decoration:none}
.db-assess-body{flex:1;min-width:0}
.db-assess-name{font-size:13px;font-weight:600;color:#1e293b}
.db-assess-course{font-size:11px;color:#64748b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
.db-assess-badge{display:inline-block;background:#dcfce7;color:#16a34a;font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;margin-top:3px}
/* === New Lead Requests card === */
.db-lead-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;background:#6366f1;color:#fff;font-size:11px;font-weight:700;border-radius:10px;padding:0 5px;margin-left:6px;vertical-align:middle}
.db-lead-name{font-weight:600;color:#1e293b;font-size:13px}
.db-lead-email{color:#6366f1;font-size:12px;text-decoration:none}
.db-lead-email:hover{text-decoration:underline;color:#4f46e5}
/* === Announcement Modal (mv-modal) === */
.mv-modal-dialog{max-width:520px;margin:60px auto}
.mv-modal{border-radius:16px!important;overflow:hidden;border:none!important;box-shadow:0 24px 64px rgba(15,23,42,.22)!important}
.mv-modal__header{display:flex;align-items:center;gap:14px;padding:22px 24px;background:linear-gradient(135deg,#1e293b 0%,#334155 100%);border-bottom:none!important}
.assignCourseModal .mv-modal__header{
    align-items: center;
}

.mv-modal__header-icon{width:42px;height:42px;border-radius:10px;background:rgba(99,102,241,.28);display:flex;align-items:center;justify-content:center;font-size:18px;color:#818cf8;flex-shrink:0;margin-top:1px}
.mv-modal__header i{
    margin: 0 !important;
}
.mv-modal__header-icon--danger{background:rgba(239,68,68,.22);color:#f87171}
.mv-modal__header-text{
    flex:1;
    min-width:0;
    height: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.mv-modal__title{font-size:15px!important;font-weight:700!important;color:#f1f5f9!important;margin:0 0 0px!important;line-height:1.3}
.assignCourseModal .mv-modal__header .mv-modal__title{ margin:0 !important;}
.mv-modal__subtitle{font-size:12px;color:#94a3b8;margin:0;line-height:1.4}
.mv-modal__close{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)!important;border-radius:8px;width:32px;height:32px;min-width:32px;display:flex;align-items:center;justify-content:center;color:#94a3b8;cursor:pointer;flex-shrink:0;transition:background .15s,color .15s;font-size:14px;opacity:1!important}
.mv-modal__close:hover{background:rgba(255,255,255,.18);color:#f1f5f9}
.mv-modal__body{padding:24px 24px 20px}
.mv-modal__label{display:block;font-size:12px;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
.mv-modal__textarea{width:100%!important;min-height:130px;border:1.5px solid #e2e8f0;border-radius:10px;padding:12px 14px;font-size:14px;color:#1e293b;line-height:1.6;resize:vertical;transition:border-color .15s,box-shadow .15s;outline:none;display:block;box-sizing:border-box}
.mv-modal__textarea:focus{border-color:#6366f1!important;box-shadow:0 0 0 3px rgba(99,102,241,.12)!important}
.mv-modal__textarea::placeholder{color:#94a3b8}
.mv-modal__footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 24px;background:#f8fafc;border-top:1px solid #e2e8f0!important}
/* === Card Header Icon-Action Buttons (ch-btn) === */
.ch-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
.ch-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;border:1.5px solid;font-size:13px;text-decoration:none;transition:background .15s,color .15s,border-color .15s;cursor:pointer}
.ch-btn--add{border-color:#cbd5e1;color:#64748b;background:#fff}
.ch-btn--add:hover{border-color:#6366f1;color:#6366f1;background:#eef2ff}
.ch-btn--view{border-color:#cbd5e1;color:#64748b;background:#fff}
.ch-btn--view:hover{border-color:#2d7ff9;color:#2d7ff9;background:#eff6ff}
/* === visitors-dashboard redesign === */
#visitors-dashboard{padding:12px 0}
.rt-meta-bar{padding:0 0 10px;font-size:12px;color:#94a3b8}
.rt-module-list{display:flex;flex-direction:column;gap:8px}
.rt-module-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;transition:background .15s,border-color .15s;border:1px solid #f1f5f9}
.rt-module-row:hover{background:#f8fafc;border-color:#e2e8f0}
.rt-module-row__icon{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
.rt-icon--course{background:#ede9fe;color:#7c3aed}
.rt-icon--assess{background:#fef3c7;color:#d97706}
.rt-icon--assign{background:#dcfce7;color:#16a34a}
.rt-icon--curric{background:#dbeafe;color:#2563eb}
.rt-module-row__content{flex:1;min-width:0}
.rt-module-row__label{display:block;font-size:12px;font-weight:500;color:#374151;margin-bottom:4px}
.rt-module-row__track{height:6px;background:#e2e8f0;border-radius:3px;overflow:hidden}
.rt-module-row__fill{height:100%;border-radius:3px;transition:width .4s ease}
.rt-fill--course{background:#7c3aed}
.rt-fill--assess{background:#d97706}
.rt-fill--assign{background:#16a34a}
.rt-fill--curric{background:#2563eb}
.rt-module-row__pct{font-size:11px;font-weight:600;color:#374151;width:34px;text-align:right;flex-shrink:0}
.rt-pct--zero{color:#cbd5e1}
.rt-live-pulse{color:#22c55e;font-size:11px;animation:rt-blink 1.6s ease-in-out infinite}
@keyframes rt-blink{0%,100%{opacity:1}50%{opacity:.25}}
.rt-live-panel{padding:2px 0}
.rt-live-counter{text-align:center;padding:14px 0 10px;border-bottom:1px solid #f1f5f9;margin-bottom:12px}
.rt-live-counter__num{display:block;font-size:40px;font-weight:700;color:#0f172a;line-height:1}
.rt-live-counter__label{display:block;font-size:11px;color:#94a3b8;margin-top:3px;letter-spacing:.02em}
.rt-live-badges{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.rt-live-badge{display:flex;flex-direction:column;align-items:center;flex:1;min-width:64px;padding:9px 4px;border-radius:10px;border:1.5px solid #e2e8f0;text-decoration:none;cursor:pointer;transition:border-color .15s,background .15s;color:inherit}
.rt-live-badge:hover{text-decoration:none}
.rt-live-badge i{font-size:15px;margin-bottom:2px}
.rt-live-badge__val{font-size:17px;font-weight:700;line-height:1.2}
.rt-live-badge__lbl{font-size:10px;color:#94a3b8;text-align:center;margin-top:1px}
.rt-badge--learner{border-color:#dbeafe;color:#2563eb}.rt-badge--learner:hover{background:#eff6ff;border-color:#93c5fd;color:#1d4ed8}
.rt-badge--instructor{border-color:#fef3c7;color:#d97706}.rt-badge--instructor:hover{background:#fffbeb;border-color:#fcd34d;color:#b45309}
.rt-badge--visitor{border-color:#dcfce7;color:#16a34a}.rt-badge--visitor:hover{background:#f0fdf4;border-color:#86efac;color:#15803d}
.rt-device-split{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid #f1f5f9}
.rt-device-row{display:flex;align-items:center;gap:8px}
.rt-device-icon{font-size:14px;width:18px;text-align:center;flex-shrink:0}
.rt-device-icon--desktop{color:#6366f1}
.rt-device-icon--mobile{color:#06b6d4}
.rt-device-label{font-size:11px;color:#64748b;width:54px;flex-shrink:0}
.rt-device-track{flex:1;height:7px;background:#e2e8f0;border-radius:4px;overflow:hidden}
.rt-device-fill{height:100%;border-radius:4px;transition:width .4s ease}
.rt-device-fill--desktop{background:linear-gradient(90deg,#6366f1,#818cf8)}
.rt-device-fill--mobile{background:linear-gradient(90deg,#06b6d4,#22d3ee)}
.rt-device-pct{font-size:11px;font-weight:600;color:#374151;width:34px;text-align:right;flex-shrink:0}
.rt-accordion-group{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden;margin-bottom:10px}
.rt-accordion-head{background:#f8fafc;border-bottom:1px solid #e2e8f0}
.rt-accordion-head a{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;color:#374151;font-weight:500;font-size:13px;text-decoration:none}
.rt-accordion-head a:hover{color:#6366f1;background:#eef2ff;text-decoration:none}
.rt-accordion-count{font-size:11px;color:#6366f1;background:#eef2ff;padding:2px 8px;border-radius:12px;font-weight:600;flex-shrink:0}
.rt-empty-state{text-align:center;padding:20px 16px;color:#94a3b8;font-size:13px}
.rt-empty-state i{display:block;font-size:22px;margin-bottom:5px}
#chartcontainer2{min-height:320px}
/* visitors-dashboard: stretch card to fill column height */
.rt-card-stretch{flex:1;display:flex;flex-direction:column}
.rt-card-stretch .card_body_new{flex:1}
/* Right Now horizontal strip */
.rt-now-strip{display:flex;align-items:center;flex-wrap:wrap;gap:0;min-height:60px}
.rt-now-counter-h{display:flex;align-items:center;gap:12px;padding-right:24px;border-right:1px solid #e8edf2;margin-right:20px;flex-shrink:0}
.rt-now-counter-h__num{font-size:34px;font-weight:700;color:#0f172a;line-height:1}
.rt-now-counter-h__label{font-size:11px;color:#94a3b8;max-width:80px;line-height:1.4}
.rt-now-badges-h{display:flex;gap:8px;flex:1;min-width:0}
.rt-now-badges-h .rt-live-badge{flex:0 0 auto;min-width:80px;max-width:120px}
.rt-now-devices-h{display:flex;gap:20px;padding-left:20px;border-left:1px solid #e8edf2;margin-left:20px;flex-shrink:0}
.rt-now-device-col{min-width:130px}
.rt-now-device-top{display:flex;align-items:center;gap:6px;margin-bottom:5px}
/* ── Page Footer (pagefooter) ─────────────────────────────────────── */
.pagefooter.footer{background:#fff;border-top:3px solid #6366f1;box-shadow:0 -1px 0 #e2e8f0}
.pf-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:12px 28px}
.pf-left{display:flex;align-items:center;gap:14px}
.pf-logo{height:28px;width:auto}
.pf-sep{width:1px;height:18px;background:#cbd5e1;flex-shrink:0}
.pf-copy{color:#64748b;font-size:12px;letter-spacing:.01em}
.pf-right{display:flex;align-items:center;gap:12px}
.pf-version{background:#f1f5f9;border:1px solid #e2e8f0;color:#64748b;font-size:11px;padding:4px 12px;border-radius:20px;letter-spacing:.02em}
.pf-version i{color:#6366f1;margin-right:4px}
.pf-support-btn{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#6366f1 0%,#7c3aed 100%);color:#fff !important;font-size:12px;font-weight:600;padding:7px 18px 7px 14px;border-radius:8px !important;text-decoration:none !important;line-height:1.4;letter-spacing:.02em;box-shadow:0 2px 10px rgba(99,102,241,.38);transition:box-shadow .2s ease,transform .15s ease}
.pf-support-btn:hover{color:#fff !important;text-decoration:none !important;box-shadow:0 4px 18px rgba(99,102,241,.55);transform:translateY(-1px)}
.pf-support-btn .pf-support-icon{width:22px;height:22px;background:rgba(255,255,255,.18);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}
@media(max-width:640px){.pf-inner{flex-direction:column;align-items:flex-start;padding:12px 16px;gap:10px}}


/* ── _ClientLayout ──────────────────────────────────────────────── */
/* Block 1 – conditional chat-window hide (inside @if TemplateId==2) */
.chat-window {
    display: none !important;
}
/* Block 2 & 3 – alertnotviewed (appears twice, same rule – consolidated) */
.alertnotviewed {
    background: #f0f0d0 !important;
}
/* Block 4 – userSettingsMenu + supportTickets + sidebar menu-report */
.userSettingsMenu {
    width: 225px;
}
.supportTickets {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: -10px;
    font-size: 24px;
}
.supportTickets:hover a {
    color: initial !important;
}
.page-sidebar-closed .page-sidebar-menu > li > .menu-report {
    display: none !important;
    max-height: 200px;
    overflow-y: auto !important;
    pointer-events: all;
    touch-action: auto;
}

/* ── _ClientLayout: mv-topbar — modernized common header ───────────
   Scoped to .mv-topbar (added only on the Client role header wrapper)
   so it never touches the 14 other layouts sharing this same markup.
   Height/box-model of .header is left untouched (common.css: 50px)
   so the fixed offset the rest of the page relies on doesn't shift. */
.mv-topbar.header {
    background: #fff !important;
    box-shadow: 0 2px 12px rgba(15, 23, 42, .08) !important;
}
.mv-topbar .navbar-brand {
    border-right: 1px solid #eef1f6;
    margin-top: 3px;
}
.mv-topbar .navbar-brand img.extralogo {
    max-height: 32px;
    width: auto;
}
.mv-topbar .navbar-toggle {
    border-radius: 8px;
    background: #f8fafc;
    border: 1px solid #eef1f6 !important;
    transition: background .15s ease;
}
.mv-topbar .navbar-toggle:hover {
    background: #eef2ff;
}
/* quick-create / support-ticket / notification-bell icon chips.
   Fixed-size wrapper (.mv-topbar__ico, added around each icon in the view)
   so the round chip renders true and doesn't inherit the legacy
   dropdown-toggle's uneven padding box (which is taller than it is wide). */
.mv-topbar .mv-topbar__ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #f8fafc;
    border: 1px solid #eef1f6;
    color: #64748b;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
    vertical-align: middle;
}
.mv-topbar .mv-topbar__ico i,
.mv-topbar .mv-topbar__ico svg {
    color: #64748b !important;
}
.mv-topbar .navbar-nav > li.dropdown > a.dropdown-toggle:hover .mv-topbar__ico,
.mv-topbar .supportTickets a:hover .mv-topbar__ico {
    background: #eef2ff;
    border-color: #c7d2fe;
}
.mv-topbar .navbar-nav > li.dropdown > a.dropdown-toggle:hover .mv-topbar__ico i,
.mv-topbar .navbar-nav > li.dropdown > a.dropdown-toggle:hover .mv-topbar__ico svg,
.mv-topbar .supportTickets a:hover .mv-topbar__ico i,
.mv-topbar .supportTickets a:hover .mv-topbar__ico svg {
    color: #6366f1 !important;
}
.mv-topbar li.dropdown.user > a.dropdown-toggle {
    border-radius: 10px;
}
.mv-topbar li.language select {
    height: 32px;
    border-radius: 8px;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    font-size: 12px;
    color: #475569 !important;
}
.mv-topbar li.language select:focus {
    outline: none;
    border-color: #6366f1 !important;
}
.mv-topbar .notification_bell .badge {
    background: #ef4444 !important;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px #ef4444;
    top: 6px !important;
}
.mv-topbar li.dropdown.user .icon-circle {
    border: 2px solid #6366f1;
    box-shadow: 0 0 0 2px #eef2ff;
}
.mv-topbar li.dropdown.user > a.dropdown-toggle:hover {
    background: #f8fafc !important;
    text-decoration: none;
}
.mv-topbar .username {
    color: #334155 !important;
    font-weight: 600 !important;
}
.mv-topbar .username .mobile-hide {
    color: #94a3b8 !important;
    font-weight: 400 !important;
}
.mv-topbar .feather-chevron-down,
.mv-topbar li.dropdown.user svg.lucide {
    color: #94a3b8 !important;
}
.mv-topbar .dropdown-menu {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .12);
    padding: 6px;
}
.mv-topbar .dropdown-menu > li > a {
    border-radius: 8px;
}
.mv-topbar .dropdown-menu > li > a:hover {
    background: #eef2ff !important;
    color: #6366f1 !important;
}
.mv-topbar .userSettingsMenu li.divider {
    margin: 6px 0;
    background: #e2e8f0;
}

/* ── _CustAuthorLayout ──────────────────────────────────────────── */
/* alertnotviewed – identical to _ClientLayout block; already defined above */

/* ── _CustStudentLayout ─────────────────────────────────────────── */
/* alertnotviewed – identical; already defined above */

/* ── _employeeLayout ────────────────────────────────────────────── */
/* supportTickets – same core rule; already defined above */

/* ── _employeeLayout_demo ───────────────────────────────────────── */
.uname {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: black;
}
.dropdown-menu {
    min-width: 100%;
}

.st-ddl{
    margin-left: auto;
}
.st-ddl-menu.dropdown-menu{
    right: 0;
    left: auto;
}
.ddTog {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background-color: white;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    margin: 0px !important;
}
.profileDD {
    background-color: white;
    border-radius: 8px;
    box-shadow: rgba(50, 50, 93, 0.1) 0px 13px 27px -5px, rgba(0, 0, 0, 0.05) 0px 8px 16px -8px;
    margin-top: 8px;
    overflow: hidden;
    padding: 0px;
}
.flex_nav_news_info ul.list li a i {
    height: auto;
    width: auto;
    font-size: 16px;
    color: #7f8c8d;
}
.username span {
    font-size: 12px;
    color: #7f8c8d;
}
.flex_nav_news_info li ul li a {
    display: flex !important;
    align-items: center;
    gap: 5px;
    margin-left: 0 !important;
    font-size: 14px !important;
    color: #2c3e50 !important;
    padding: 12px 16px !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}
.searchFil {
    margin: 0px;
    list-style: none;
}
.input_custom_styles {
    margin-bottom: 0px;
}
.headFil {
    padding: 8px 12px !important;
    padding-left: 36px;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    background-color: #f5f7fa;
    transition: all 0.2s;
}
.headFil:focus {
    outline: none;
    border-color: #3498db !important;
    background-color: white;
    box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.1);
}
header img {
    height: 30px !important;
}
.headerP1 {
    display: flex;
    align-items: center;
}
.headerP1 p {
    font-size: 13px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    letter-spacing: normal;
    margin-top: 9px;
    color: #7f8c8d;
}
.headerP1 p span {
    font-weight: 500;
    color: #2c3e50;
}

/* ── _InstructorLayout ──────────────────────────────────────────── */
.page-sidebar-closed .page-content {
    margin-left: 0px;
}
/* .page-sidebar-closed .page-content.empContent{
    margin-left: 20px;
    padding-right: 0 !important;
} */
.page-content {
    background: #f5f6fa;
}
.flex_nav_news_info select {
    padding: 8px 10px;
    border-radius: 8px;
    margin: 0;
    border: 1px solid rgb(238, 238, 238);
    margin-right: 10px;
}
.header .navbar-brand img {
    height: 40px;
    margin-left: 75px !important;
    object-fit: contain;
}
.row {
    margin-right: 0px;
    margin-left: 0px;
}
.page-sidebar-closed .page-sidebar {
    height: 100% !important;
}
.page-sidebar-fixed .page-sidebar {
    background: #1d2939;
    -webkit-box-shadow: 2px 0 0.7rem -2px #888 !important;
    height: 100% !important;
    box-shadow: 2px 0 0.7rem -2px #888 !important;
    max-height: 100%;
}
.page-sidebar-menu > li > a > .arrow.open:before {
    display: none;
}
.page-sidebar-menu > li:last-child > ul.sub-menu {
    top: auto !important;
    bottom: 100%;
    overflow-y: auto;
    height: auto;
    max-height: 30.0rem;
}
.page-sidebar-closed ul.page-sidebar-menu > li.end:hover .sub-menu {
    background-color: #526672 !important;
    border-top-right-radius: 25px !important;
    border-bottom-right-radius: 0px !important;
    background: #5F7E91 !important;
    overflow: hidden;
}
.page-sidebar-closed ul.page-sidebar-menu > li .sub-menu {
    background-color: #526672 !important;
    background: #5F7E91 !important;
    overflow: hidden;
}
.page-sidebar-closed .page-sidebar-menu > li:hover {
    width: 300px !important;
    position: relative !important;
    z-index: 2000;
    display: block !important;
}
.page-sidebar-closed .page-sidebar-menu > li:hover > .sub-menu > li > a {
    padding-left: 10px !important;
}
.slimScrollDiv {
    height: 100% !important;
}
/* alertnotviewed + profileDdl hover – _InstructorLayout */
.profileDdl li > a:hover {
    color: white !important;
}

/* ── _ProviderLayout ────────────────────────────────────────────── */
/* supportTickets – same core rule; already defined above (no top:-10px here) */
/* alertnotviewed – already defined above */

/* ── _ProviderLayout2 ───────────────────────────────────────────── */
.ui-widget-content .btn {
    color: #fff;
}

/* ── _SkillsClientLayout ─────────────────────────────────────────── */
/* alertnotviewed – already defined above */
.ui-autocomplete {
    z-index: 99999 !important;
}
.pac-container {
    z-index: 99999 !important;
}
.has-error {
    border-color: #e75725;
}

.card_header_new, .portlet-title-new {
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }

    

/* ── _SkillsCustStudentLayout ────────────────────────────────────── */
/* alertnotviewed – already defined above */

/* ── _SkillsTrainingManagerLayout ───────────────────────────────── */
/* alertnotviewed – already defined above */
/* .has-error – already defined above (identical rule) */

/* ── _StudentLayout ──────────────────────────────────────────────── */
/* supportTickets – same core rule; already defined above */

/* ── _StudentLayout_demo ─────────────────────────────────────────── */
/* supportTickets + profile dropdown styles – already defined above (_employeeLayout_demo has same set) */

/* ── Edit Profile Form (InstituteAdmin/ProfilesPage) ─────────────── */
.ef-form-layout {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 1.5rem;
    align-items: start;
}

.ef-section {
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #94a3b8;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid #f1f5f9;
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.ef-section:first-child {
    margin-top: 0;
}

.ef-section .fa {
    color: #a5b4fc;
    font-size: 1.3rem;
}

.ef-label {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 1.2rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0;
}

.ef-required {
    color: #f59e0b;
    font-size: 0.55rem;
    line-height: 1;
    vertical-align: top;
    margin-top: 1px;
}

.ef-error {
    font-size: 1.2rem;
    color: #ef4444;
    margin-top: 2px;
    display: block;
}

.ef-upload-col {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.ef-photo-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 8px rgba(15, 23, 42, 0.06);
}

.ef-photo-card .RadAsyncUpload {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.85rem;
    padding: 1.5rem 1rem 1.25rem;
    text-align: center;
    width: 100%;
}

.ef-photo-card__avatar {
    position: relative;
    width: 104px;
    height: 104px;
    flex-shrink: 0;
}

.ef-photo-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid #e0e7ff;
    background: #e0e7ff;
    display: block;
}

.ef-photo-card__cam {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: rgba(79, 70, 229, 0);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s;
}

.ef-photo-card__cam .fa {
    color: #fff;
    font-size: 1.1rem;
    opacity: 0;
    transition: opacity 0.2s;
    pointer-events: none;
}

.ef-photo-card__avatar:hover .ef-photo-card__cam {
    background: rgba(79, 70, 229, 0.52);
}

.ef-photo-card__avatar:hover .ef-photo-card__cam .fa {
    opacity: 1;
}

.ef-photo-card__meta {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.ef-photo-card__title {
    font-size: 1.3rem;
    font-weight: 700;
    color: #1e293b;
}

.ef-photo-card__hint {
        font-size: 1.1rem;
    color: #94a3b8;
    letter-spacing: normal;
}

.ef-file-btn {
    font-size: 1.2rem;
    color: #475569;
    cursor: pointer;
    max-width: 100%;
}

.ef-file-btn::file-selector-button {
    padding: 0.42rem 1.1rem;
    border: 1.5px solid #6366f1;
    border-radius: 7px;
    background: #fff;
    color: #6366f1;
    font-size: 1.2rem;
    font-weight: 600;
    cursor: pointer;
    margin-right: 0.6rem;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.ef-file-btn::file-selector-button:hover {
    background: #eef2ff;
    border-color: #4f46e5;
    color: #4f46e5;
}

.ef-photo-card__remove-row {
    width: 100%;
    border-top: 1px solid #f1f5f9;
    padding-top: 0.75rem;
}

.ef-photo-card__remove {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.38rem 0.75rem;
    border: 1.5px solid #fca5a5;
    border-radius: 7px;
    background: #fff5f5;
    color: #dc2626;
    font-size: 1.3rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.ef-photo-card__remove:hover {
    background: #fee2e2;
    border-color: #dc2626;
}

@media (max-width: 991px) {
    .ef-form-layout {
        grid-template-columns: 1fr;
    }
}

/* ── Form Card (InstituteAdmin/ProfilesPage) ─────────────────────── */
.fc-card {
    background: #fff;
    border-radius: 12px !important;
    box-shadow: 0 2px 16px rgba(15, 23, 42, 0.08);
    margin-bottom: 1.25rem;
    overflow: hidden;
}

.fc-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.9rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    background: #fafbff;
}

.fc-card__header-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.3rem;
    font-weight: 700;
    color: #1e293b;
    padding-left: 0.75rem;
    border-left: 3px solid #6366f1;
}

.fc-card__header-title .fa {
    color: #6366f1;
}

.fc-card__header-note {
    font-size: 1.2rem;
    color: #94a3b8;
}

.fc-card__header-note .fa {
    color: #f59e0b;
    font-size: 0.6rem;
    vertical-align: middle;
}

.fc-card__body {
    padding: 1.5rem;
}

.fc-card__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.25rem;
}

.fc-card__grid--3col {
    grid-template-columns: repeat(3, 1fr);
}

.fc-card__field {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.fc-card__field--full {
    grid-column: 1 / -1;
}

.fc-card__field label.control-label {
    font-size: 1.2rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0;
}

.fc-card__upload-box {
    border: 2px dashed #c7d2fe;
    border-radius: 8px;
    padding: 1.25rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    background: #f8f9ff;
    text-align: center;
}

.fc-card__upload-preview {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #e0e7ff;
    background: #e0e7ff;
    flex-shrink: 0;
}

.fc-card__upload-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.fc-card__footer {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #f1f5f9;
    background: #fafbff;
}

@media (max-width: 767px) {
    .fc-card__grid,
    .fc-card__grid--3col {
        grid-template-columns: 1fr;
    }
    .fc-card__field--full {
        grid-column: 1;
    }
}

/* ── Profile Card (InstituteAdmin/ProfilesPage) ──────────────────── */
.prof-card {
    background: #fff;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.10);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.prof-card__banner {
    height: 80px;
    background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%);
    flex-shrink: 0;
}

.prof-card__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 1.5rem 1.5rem;
    text-align: center;
}

.prof-card__avatar {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    overflow: hidden;
    border: 4px solid #fff;
    box-shadow: 0 2px 12px rgba(99, 102, 241, 0.20);
    margin-top: -48px;
    background: #e0e7ff;
    flex-shrink: 0;
}

.prof-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.prof-card__name {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0.75rem 0 0;
    line-height: 1.3;
}

.prof-card__info {
    width: 100%;
    margin: 0.75rem 0 1.25rem;
    border-top: 1px solid #f1f5f9;
    padding-top: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.prof-card__info-row {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 1.3rem;
    color: #475569;
    text-align: left;
    word-break: break-word;
}

.prof-card__info-icon {
    color: #6366f1;
    width: 14px;
    text-align: center;
    flex-shrink: 0;
    margin-top: 2px;
}

.prof-card__actions {
    width: 100%;
}

.prof-card__actions .ph-btn {
    width: 100%;
    justify-content: center;
}

.impCourseHint{
        margin: 0;
    line-height: normal !important;
    letter-spacing: normal;
    color: #818181;
    font-weight: 500;
    /* flex-grow: 1; */
    background: #f5f6fa;
    padding: 1px 10px;
    border-radius: 5px !important;
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 3px;
}
.impCourseHint i{
    margin-right: 3px;
}


/* ── _TrainingManagerLayout ──────────────────────────────────────── */
/* alertnotviewed – already defined above */

/* -- Role Management Modals ---------------------------------------- */
#AddRole .modal-header,
#EditRole .modal-header{background:linear-gradient(135deg,#4f46e5 0%,#6366f1 100%);border-bottom:none;border-radius:5px 5px 0 0;padding:16px 20px}
#AddRole .modal-title,
#EditRole .modal-title{color:#fff!important}
#AddRole .modal-header .close,
#EditRole .modal-header .close{color:#fff!important;opacity:.85;text-shadow:none;filter:none}
#AddRole .modal-header .close:hover,
#EditRole .modal-header .close:hover{opacity:1}
.mv-role-help-list{margin:0;padding:0}
.mv-role-help-list>li{list-style:none;padding:9px 0;border-bottom:1px solid #e2e8f0;font-size:13px;line-height:1.55}
.mv-role-help-list>li:last-child{border-bottom:none;padding-bottom:0}
.mv-role-help-list>li b{display:block;color:#1e3a5f;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px}

/* -- Confirm Delete Modal ------------------------------------------ */
#ConfirmDelete .modal-header{background:linear-gradient(135deg,#dc2626 0%,#ef4444 100%);border-bottom:none;border-radius:5px 5px 0 0;padding:16px 20px}
#ConfirmDelete .modal-title,
#ConfirmDelete .modal-header .close{color:#fff!important;text-shadow:none}
#ConfirmDelete .modal-header .close{opacity:.85;filter:none}
#ConfirmDelete .modal-header .close:hover{opacity:1}
#ConfirmDelete .modal-body{text-align:center;padding:32px 24px 20px}
#ConfirmDelete .mv-confirm__icon{font-size:52px;color:#dc2626;display:block;margin-bottom:14px}
#ConfirmDelete .mv-confirm__msg{font-size:15px;color:#374151;margin:0}
#ConfirmDelete .mv-confirm__sub{font-size:12px;color:#6b7280;margin-top:6px}
.mv-confirm__icon{font-size:52px;display:block;margin-bottom:14px}
.mv-confirm__icon--danger{color:#dc2626}
.mv-confirm__msg{font-size:15px;color:#374151;margin:0}
.mv-confirm__sub{font-size:12px;color:#6b7280;margin-top:6px}

/* -- Validation Banner (shared) ------------------------------------------ */
.vld-banner {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-left: 4px solid #ef4444;
    border-radius: 8px;
    padding: 12px 14px;
    margin-bottom: 16px;
    font-size: 13px;
    color: #991b1b;
}
.vld-banner > .fa {
    font-size: 16px;
    color: #ef4444;
    flex-shrink: 0;
    margin-top: 1px;
}
.vld-banner__body { flex: 1; }
.vld-banner__body strong {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
    color: #7f1d1d;
}
.vld-banner__body ul {
    margin: 0;
    padding-left: 18px;
}
.vld-banner__body ul li {
    margin-bottom: 2px;
    line-height: 1.5;
}
.vld-banner__close {
    background: none;
    border: none;
    color: #f87171;
    cursor: pointer;
    padding: 0;
    font-size: 14px;
    flex-shrink: 0;
    line-height: 1;
}
.vld-banner__close:hover { color: #ef4444; }

/* -- CreateQuiz Form (Assessment/CreateQuiz) ------------------------------------------ */

/* Step-1 three-column layout: add horizontal gap between columns */
.crtquiz #step-1 > div.ng-if > .flex.flex-wrap,
.crtquiz #step-1 .flex.flex-wrap {
    gap: 0;
}
.crtquiz #step-1 .flex.flex-wrap > div {
    padding-left: 20px;
    padding-right: 20px;
}
.crtquiz #step-1 .flex.flex-wrap > div:first-child { padding-left: 0; }
.crtquiz #step-1 .flex.flex-wrap > div:last-child  { padding-right: 0; }

/* Consistent vertical spacing between form groups */
.crtquiz #step-1 .form-group { margin-bottom: 20px; }

/* Sublabel notes — <i> and <span><i> helper texts inside control-label, but NOT the required-field span */
.crtquiz #step-1 label.control-label > i,
.crtquiz #step-1 label.control-label > span:not(.required-field) > i {
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #9ca3af !important;
    font-style: italic;
    display: block;
    margin-top: 2px;
}

/* Required-field indicator — inline asterisk, replaces the fa-star icon */
.crtquiz #step-1 label.control-label .required-field {
    display: inline !important;
    white-space: nowrap;
    vertical-align: baseline;
}
.crtquiz #step-1 label.control-label .required-field i.fa-star {
    display: none;
}
.crtquiz #step-1 label.control-label .required-field::after {
    content: '*';
    color: #ef4444;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    margin-left: 1px;
    vertical-align: baseline;
}

/* Error messages */
.crtquiz .errorcolor span {
    font-size: 11px;
    color: #dc2626;
    display: block;
    margin-top: 4px;
}

/* Required-fields notice banner */
.crtquiz .form-message-box {
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    padding: 8px 14px;
    font-size: 12px;
    color: #92400e;
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 16px;
    text-align: left;
}
.crtquiz .form-message-box .fa-star { font-size: 8px; color: #dc2626; vertical-align: middle; }

/* Assessment-type radio row at top of step-1 — horizontal pill group */
.crtquiz .radio_client {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
    padding: 4px 0;
}
/* Override qtype-opt base (full-width table row) → compact inline pill */
.crtquiz .radio_client .qtype-opt {
    width: auto;
    padding: 8px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    background: #f8fafc;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.crtquiz .radio_client .qtype-opt:hover {
    background: #eef2ff;
    border-color: #818cf8;
}
.crtquiz .radio_client .qtype-opt:has(input:checked) {
    background: #eef2ff;
    border-color: #6366f1;
    box-shadow: 0 0 0 2px rgba(99,102,241,.18);
}
.crtquiz .radio_client .qtype-opt__text {
    font-size: 13px;
    font-weight: 500;
}

/* Middle column separator gets horizontal padding so content clears the border */
.crtquiz .bordercol {
    border-left: 1px solid #e8edf3;
    border-right: 1px solid #e8edf3;
}

/* Quiz-type radio option table */
.crtquiz #ContentPlaceHolder1_radioQuestionType {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 5px;
    margin-top: 4px;
}
.crtquiz #ContentPlaceHolder1_radioQuestionType td {
    padding: 0;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.crtquiz #ContentPlaceHolder1_radioQuestionType td:hover {
    background: #eef2ff;
    border-color: #818cf8;
}
/* Highlight entire row when its radio is checked */
.crtquiz #ContentPlaceHolder1_radioQuestionType td:has(input:checked) {
    background: #eef2ff;
    border-color: #6366f1;
    box-shadow: 0 0 0 2px rgba(99,102,241,.18);
}
/* Full-row clickable label */
.crtquiz .qtype-opt {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 12px;
    margin: 0 !important;
    cursor: pointer;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #374151 !important;
    line-height: 1.4;
}
/* Hide native radio and any Uniform-generated wrapper inside qtype-opt */
.crtquiz .qtype-opt input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}
.crtquiz .qtype-opt .radio,
.crtquiz .qtype-opt .checker {
    display: none !important;
}
/* Custom radio dot */
.crtquiz .qtype-opt__dot {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #cbd5e1;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color .15s;
}
.crtquiz .qtype-opt__dot::after {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #6366f1;
    opacity: 0;
    transform: scale(.6);
    transition: opacity .15s, transform .15s;
}
/* Checked state: fill the dot — uses :has() so it works even when Uniform wraps the input */
.crtquiz .qtype-opt:has(input[type="radio"]:checked) .qtype-opt__dot {
    border-color: #6366f1;
}
.crtquiz .qtype-opt:has(input[type="radio"]:checked) .qtype-opt__dot::after {
    opacity: 1;
    transform: scale(1);
}
/* Option label text */
.crtquiz .qtype-opt__text {
    flex: 1;
    font-size: 12px;
    font-weight: 500;
    color: #374151;
}
.crtquiz .qtype-opt__text a.popovers {
    color: #6366f1;
    font-size: 11px;
    text-decoration: none;
    margin-left: 3px;
    font-weight: 400;
}
/* Disabled option (QuizId > 0 locks type) */
.crtquiz .qtype-opt:has(input[type="radio"]:disabled) {
    cursor: not-allowed;
    opacity: .5;
}

/* Right-column checkboxes */
.crtquiz #step-1 input[type="checkbox"] {
    accent-color: #6366f1;
    cursor: pointer;
    width: 14px;
    height: 14px;
    vertical-align: middle;
    margin-right: 6px;
    margin-top: -2px;
}
.crtquiz #step-1 .form-group label.control-label small.text-primary {
    display: block;
    font-size: 11px !important;
    font-weight: 400 !important;
    color: #6b7280 !important;
    margin-top: 3px;
    padding-left: 20px;
    line-height: 1.45;
}

/* Negative-marking sub-section */
.crtquiz .neg-marks { margin-top: 8px; padding: 8px 10px; background: #f8fafc; border-radius: 6px; border: 1px solid #e2e8f0; }
.crtquiz .neg-marks input[type="radio"] { accent-color: #6366f1; margin-right: 4px; vertical-align: middle; cursor: pointer; }
.crtquiz .neg-marks > br { display: none; }

.crtquiz .neg-marks .control-label{
   display: flex;
    align-items: center;
    gap: 3px;
}
/* Step-1 top assessment-type form-group extra padding */
.crtquiz #step-1 > .flex.flex-wrap > .form-group { padding-bottom: 8px; }

@media (max-width: 767px) {
    .crtquiz #step-1 .flex.flex-wrap > div,
    .crtquiz #step-1 .flex.flex-wrap > div:first-child,
    .crtquiz #step-1 .flex.flex-wrap > div:last-child {
        padding-left: 0;
        padding-right: 0;
    }
    .crtquiz .bordercol {
        border-left: none;
        border-right: none;
        border-top: 1px solid #e8edf3;
        border-bottom: 1px solid #e8edf3;
        margin: 10px 0;
        padding: 10px 0;
    }

/* — Delete Confirmation Modal — */
.del-confirm-icon { color: #ef4444; }
.del-confirm-body { padding: 24px 24px 16px; }
.del-confirm-message { color: #64748b; font-size: 14px; margin: 0 0 10px; line-height: 1.5; }
.del-confirm-name { font-size: 15px; color: #1e293b; margin: 0; }
}

/* ── Employee Card List ──────────────────────────────────────────────────── */
.ul-outer .portlet-content,.table-outer.clearfix .portlet-content{background:#f8fafc;border-radius:12px;padding:16px}
.card-employeeslist{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.06);padding:14px 20px 14px 24px;display:flex;align-items:center;gap:16px;position:relative;transition:box-shadow .2s ease,transform .2s ease;margin-bottom:10px}
.card-employeeslist::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#6366f1,#8b5cf6);border-radius:12px 0 0 12px}
.card-employeeslist:hover{box-shadow:0 8px 28px rgba(99,102,241,.15);transform:translateY(-2px)}
.card-employeeslist .emp-avatar img{width:52px;height:52px;object-fit:cover;border-radius:50% !important;border:2px solid #e2e8f0}
.card-employeeslist .emp-body{flex:1;min-width:0}
.card-employeeslist .emp-name{font-size:15px;font-weight:700;color:#0f172a;margin-bottom:8px;line-height:1.3}
.card-employeeslist .emp-meta{display:flex;flex-wrap:wrap;gap:6px}
.card-employeeslist .emp-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.card-employeeslist.emp-empty{justify-content:center;color:#94a3b8;font-size:14px;gap:8px}
.card-employeeslist.emp-empty::before{display:none}

/* ── Employee Report View ────────────────────────────────────────────────── */
.rpt-profile-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.06);padding:20px 24px;display:flex;align-items:center;gap:20px;margin-bottom:20px;position:relative}
.rpt-profile-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#6366f1,#8b5cf6);border-radius:12px 0 0 12px}
.rpt-profile-card__avatar img{width:72px;height:72px;object-fit:cover;border-radius:50%;border:3px solid #e2e8f0}
.rpt-profile-card__info{flex:1;min-width:0}
.rpt-profile-card__name{font-size:20px;font-weight:700;color:#0f172a;margin:0 0 10px;text-transform:capitalize}
.rpt-profile-card__meta{display:flex;flex-wrap:wrap;gap:6px}
.rpt-section__header{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#6366f1;padding:10px 16px;background:#eef2ff;border-radius:8px;margin:20px 0 12px}
.rpt-section__header i{font-size:12px;color:#6366f1}
.rpt-weakness{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:20px;padding:12px 16px;background:#fff7ed;border-radius:8px;border:1px solid #fed7aa}
.rpt-weakness__label{font-size:13px;font-weight:600;color:#c2410c;flex-shrink:0}
.rpt-training-item{margin-bottom:16px}
.rpt-training-item__header{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:10px;padding:10px 16px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0}
.rpt-training-item__title{font-size:14px;font-weight:700;color:#0f172a;flex:1;min-width:0}
.rpt-training-item__meta{display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0}
.rpt-course-cell__title{font-size:13px;font-weight:700;color:#0f172a;margin-bottom:6px}
.rpt-course-cell__meta{display:flex;flex-wrap:wrap;gap:4px}

/* ── ass-panel — Assessment Detail Info Card ─────────────────────────────── */
.ass-panel{display:flex;background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);border-left:4px solid #6366f1;margin-bottom:24px;overflow:hidden}
.ass-panel__left{flex:1 1 0%;padding:16px 20px;display:flex;flex-direction:column;gap:8px;border-right:1px solid #e2e8f0;min-width:0}
.ass-panel__right{width:240px;min-width:200px;padding:14px;display:flex;flex-direction:column;gap:8px;background:#f8fafc}
.ass-panel__title{font-size:17px;font-weight:700;color:#1e293b;margin:0;line-height:1.3}
.ass-panel__header{
    display: flex;
    gap: 10px;
    align-items:flex-start;
    justify-content: space-between;
}

.ass-panel__chips{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.ass-panel__desc{font-size:12px;color:#64748b;line-height:1.5;margin:0}
.ass-panel__link{font-size:11px;color:#475569;display:flex;align-items:center;gap:6px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;padding:6px 10px;word-break:break-all;line-height:1.4}
.ass-panel__link i{margin-top:1px;flex-shrink:0;color:#6366f1;font-size:11px}
.ass-panel__link span{font-weight:600;white-space:nowrap;flex-shrink:0}
.ass-panel__link a{color:#6366f1;text-decoration:none}
.ass-panel__link a:hover{text-decoration:underline}
.ass-panel__link .btn.btn-primary i{
    color:#fff !important;
}
.ass-panel__actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}

.ass-panel__stat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:6px 10px;text-align:center}
.ass-panel__stat-icon{display:none;align-items:center;justify-content:center;width:24px;height:24px;min-width:24px;background:#eef2ff;border-radius:6px;color:#6366f1;font-size:11px;margin-bottom:0px}
.ass-panel__stat-icon svg{
    height: 14px;
    width: 14px;
}
.ass-panel__stat>div{display:flex;flex-direction:column-reverse;gap:5px;min-width:0;align-items:center}
.ass-panel__stat-label{font-size:9px;font-weight:700;color:#94a3b8;text-transform:uppercase;letter-spacing:.04em;line-height:1;display:block; margin: 2px 0 0;}
.ass-panel__stat-value{
    font-size: 14px;
    font-weight: 700;
    color: #1e293b;
    line-height: 1;
    display: flex;
    align-items: center;
    gap: 3px;
}
.ass-panel__stat-value small{
        font-size: 9px;
    font-weight: 400;
    color: #94a3b8;
    margin: 2px 0 0 0;
}
.ass-panel__img-box{display:flex;flex-direction:column;align-items:center;gap:10px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;padding:7px 10px}
.ass-panel__img-box img{width:44px;height:44px;object-fit:contain;border-radius:4px;border:1px solid #e2e8f0;flex-shrink:0}
.ass-panel__img-box>div{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.ass-panel__img-box .progress{margin:0;height:6px}
.ass-panel__img-box label{margin:0;align-self:flex-start}
.ass-panel__qr{display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:10px}
.ass-panel__stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.ass-panel__header .ass-panel__stat-grid{
    display: flex;
    flex:1;
    justify-content: end;
}


@media(max-width:768px){.ass-panel{flex-direction:column}.ass-panel__left{border-right:none;border-bottom:1px solid #e2e8f0}.ass-panel__right{width:100%;min-width:unset}}

/* ── pf (pill-filter) toolbar + search bar ───────────────────────────────── */
.pf-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:12px 16px;border-bottom:1px solid #e2e8f0;background:#fff}
.pf-toolbar__actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;flex-shrink:0}
.pf-pills{display:flex;flex-wrap:wrap;gap:4px}
.pf-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:500;color:#64748b;background:#f1f5f9;border:1px solid transparent;cursor:pointer;line-height:1.4;transition:background .15s,color .15s,border-color .15s}
.pf-pill:hover{background:#e2e8f0;color:#334155}
.pf-pill--active{background:#eef2ff;color:#4f46e5;border-color:#c7d2fe;font-weight:600}
.pf-pill__count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;font-size:10px;font-weight:700;background:#94a3b8;color:#fff}
.pf-pill--active .pf-pill__count{background:#6366f1}
.pf-pill__count--purple{background:#7c3aed}
.pf-pill__count--blue{background:#2563eb}
.pf-pill__count--amber{background:#d97706}
.pf-pill__count--red{background:#dc2626}
.pf-search{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 16px;border-bottom:1px solid #e2e8f0;background:#f8fafc; justify-content: end;}
.pf-search__group{position:relative;display:flex;align-items:center; gap: 5px;}
.pf-search__group svg{
    height: 18px;
    width: 18px; 
}
.pf-search__group i{position:absolute;left:9px;color:#94a3b8;font-size:13px;pointer-events:none}
.pf-search__input{padding:6px 10px 6px 30px;border:1px solid #e2e8f0;border-radius:6px;font-size:12px;color:#334155;background:#fff;width:180px;height:32px;outline:none;transition:border-color .15s}
.pf-search__input:focus{border-color:#6366f1;box-shadow:0 0 0 2px rgba(99,102,241,.1)}
.pf-search__date{width:155px;flex-shrink:0}
.pf-search__date .form-control{height:32px;font-size:12px;border-color:#e2e8f0;border-radius:6px 0 0 6px}
.pf-search__date .btn-default{height:32px;padding:0 8px;border-color:#e2e8f0}
.pf-search__btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid #e2e8f0;border-radius:6px;background:#fff;color:#64748b;cursor:pointer;transition:background .15s,color .15s,border-color .15s;flex-shrink:0}
.pf-search__btn:hover{background:#eef2ff;color:#6366f1;border-color:#c7d2fe}
.pf-search__btn--clear:hover{background:#fef2f2;color:#dc2626;border-color:#fecaca}

.pf-search__date .uib-datepicker-popup{
    left: -150px !important;
}

.pf-search__btn svg{
    height: 18px;
    width: 18px;
}
/* ── preassessment table — compact cell padding ─────────────────────────── */
#preassessment .tbl-panel .lst-grid > table thead th{padding:8px 10px;font-size:11px;white-space:nowrap; vertical-align: middle;}

#preassessment .tbl-panel .lst-grid > table tbody td{padding:7px 10px;font-size:12px}
/* ── milestone score chips (replaces nested milestone-table) ─────────────── */
.ms-legend{display:flex;gap:3px;margin-top:5px;justify-content: center;}
.ms-legend span{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:3px;font-size:9px;font-weight:700;background:#f1f5f9;color:#64748b;cursor:help}
.ms-row{display:flex;gap:3px;align-items:center;flex-wrap:nowrap; justify-content: center;}
.ms-chip{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 4px;border-radius:4px;font-size:11px;font-weight:700;line-height:1}
.ms-chip--total{background:#f1f5f9;color:#475569}
.ms-chip--right{background:#dcfce7;color:#15803d}
.ms-chip--wrong{background:#fee2e2;color:#dc2626}
.ms-chip--skip{background:#fef3c7;color:#b45309}
.ms-chip--eval{background:#dbeafe;color:#1d4ed8}
/* ── merged attempt + time cell ─────────────────────────────────────────── */
.att-time{display:flex;flex-direction:column;gap:2px}
.att-time__att,.att-time__time{font-size:11px;color:#475569;display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.att-time__att i,.att-time__time i{font-size:10px;color:#94a3b8}
.att-time__att svg,.att-time__time svg{height: 10px; width: 10px;}

.quiz_time_format_attempt{
        font-size: 11px;
    color: #727373;
    margin-left: 2px;
}
/* ── mv-modal — shared modal chrome ─────────────────────────────────────── */
.mv-modal{border:none;border-radius:14px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.18)}
.mv-modal__hdr{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%)}
.mv-modal__hdr-left{display:flex;align-items:center;gap:12px;min-width:0}
.mv-modal__hdr-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;min-width:40px;background:rgba(255,255,255,.2);border-radius:10px;color:#fff;font-size:18px;flex-shrink:0}
.mv-modal__hdr-title{margin:0;font-size:15px;font-weight:700;color:#fff;line-height:1.25}
.mv-modal__hdr-sub{margin:3px 0 0;font-size:11px;color:rgba(255,255,255,.72);line-height:1.3}
.mv-modal__close{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:32px;background:rgba(255,255,255,.15);border:none;border-radius:8px;color:#fff;cursor:pointer;flex-shrink:0;transition:background .15s;font-size:16px}
.mv-modal__close:hover{background:rgba(255,255,255,.3)}
.mv-modal__body{padding:20px 22px;display:flex;flex-direction:column;gap:16px;max-height:62vh;overflow-y:auto}
#c-Templateview .mv-modal__body{max-height:fit-content;}
.mv-modal__section{display:flex;flex-direction:column;gap:8px;}
.mv-modal__sec-label{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.06em}
.mv-modal__sec-label i{font-size:13px;color:#6366f1}
.mv-modal__sec-label svg{height:13px;width: 13px; color:#6366f1}

.mv-modal__footer{display:flex;align-items:center;gap:10px;justify-content:flex-end;padding:14px 22px;background:#f8fafc;border-top:1px solid #e2e8f0}
/* assign modal — location dropdowns row */
.asgn-loc-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px}
.asgn-loc-row__sel{flex:1 1 130px;min-width:110px}
.asgn-loc-row .divActions1{flex-shrink:0}
/* assign modal — deadline input width */
.asgn-date-input{max-width:300px;margin:0}
/* assign modal — validation error */
.asgn-err{font-size:12px;color:#dc2626;font-weight:500;display:block}
/* assign modal — employee table column widths + search */
#c-assignCourse .col-chk{width:160px;white-space:nowrap}
#c-assignCourse .asgn-search{width:100%}
.asgn-tbl-scroll{max-height:230px;overflow-y:auto}
/* ── Addlevel1 dynamic rows — fix Bootstrap grid conflict ────────────────── */
/* Push #dinamicLevels1 onto its own full-width line so static selects row is untouched */
.asgn-loc-row #dinamicLevels1{flex:0 0 100%}
/* Convert Bootstrap col-xs-* floats injected by Addlevel1() into flex items */
#dinamicLevels1>div{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px;margin-top:4px}
#dinamicLevels1>div>[class]{float:none!important;width:auto!important;padding:0;flex:1 1 130px;min-width:110px}
#dinamicLevels1>div>.divActions1{flex:0 0 auto}
/* Remove button inside injected rows */
#dinamicLevels1 .divActions1 a{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border:1.5px solid #fecaca;border-radius:6px;background:#fff;color:#dc2626;font-size:12px;text-decoration:none;transition:background .15s}
#dinamicLevels1 .divActions1 a:hover{background:#fef2f2}
#dinamicLevels1 .divActions1 span{padding:0!important}
/* ── mv-modal shared helpers ─────────────────────────────────────────────── */
.req-star{color:#dc2626;font-size:11px;margin-left:2px}
/* uib-timepicker read-only cursor (was inline <style> in ExtendDueDate modal) */
.parentCls .uib-time input{pointer-events:none;caret-color:transparent}
/* neutralise Bootstrap form-horizontal inside mv-modal (negative margins, right-align labels) */
.mv-modal .form-horizontal .form-group{margin-left:0;margin-right:0}
.mv-modal .form-horizontal .control-label{text-align:left;padding-top:0}
/* mv-modal form controls — full width, consistent spacing */
.mv-modal__body .form-control{width:100%;box-sizing:border-box}
.mv-modal__body .input-group{width:100%}
/* mv-modal info banner */
.mv-info-banner{display:flex;align-items:flex-start;gap:8px;padding:10px 14px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;font-size:12px;color:#1d4ed8;line-height:1.5}
.mv-info-banner i{font-size:14px;flex-shrink:0;margin-top:1px}
/* ── Assign Group Quiz Modal (#c-assignGroupQuiz) ───────────────────────── */
.agq-form-section{padding:20px 24px;display:flex;flex-direction:column;gap:18px}
.agq-form-row{display:flex;gap:16px;flex-wrap:wrap}
.agq-form-row>.agq-form-field{flex:1;min-width:200px}
.agq-form-field{display:flex;flex-direction:column;gap:5px}
.agq-form-field>label{font-size:13px;font-weight:600;color:#374151;display:flex;align-items:center;gap:6px;margin:0}
.agq-form-field>label>.fa{color:#6366f1;font-size:12px}
.agq-form-field>label>.required-field .fa-star{color:#dc2626;font-size:9px}
.agq-loc-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.agq-loc-row>.form-control{flex:1;min-width:130px}
.agq-field-error{font-size:12px;color:#dc2626}
.agq-form-actions{display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid #f1f5f9;padding-top:16px}
.agq-unassign-row{display:flex;justify-content:flex-end;padding:4px 0}
.agq-action-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0}
.agq-license-info{font-size:12px;color:#64748b;display:flex;align-items:center;gap:5px}
.agq-license-info>.fa{color:#6366f1;font-size:12px}
.agq-assigned-tbl{margin:0 24px 24px}
.agq-select-col{width:50px}
@media(max-width:640px){.agq-form-row{flex-direction:column}.agq-loc-row{flex-direction:column}.agq-loc-row>.form-control{min-width:100%}.agq-assigned-tbl{margin:0 0 16px}}

/* ── Form Card (fc-*) ──────────────────────────────────────────────────────── */
.fc-card{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.04);border-top:3px solid #6366f1;margin-bottom:24px;overflow:hidden}
.fc-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:18px 28px;border-bottom:1px solid #e2e8f0;background:#f8fafc}
.fc-header__title{font-size:15px;font-weight:700;color:#1e293b;margin:0;display:flex;align-items:center;gap:10px;line-height:1.3}
.fc-header__title-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;background:#eef2ff;border-radius:8px;flex-shrink:0}
.fc-header__title-icon i{color:#6366f1;font-size:14px}
.fc-header__required{font-size:12px;color:#94a3b8;display:inline-flex;align-items:center;gap:4px;flex-shrink:0}
.fc-header__required .fa-star{font-size:8px;color:#ef4444;vertical-align:middle}
.fc-body{padding:0}
.fc-section{padding:24px 28px 6px}
.fc-section+.fc-section{border-top:1px solid #f0f4f8}
.fc-section__label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#6366f1;display:flex;align-items:center;gap:8px;margin-bottom:18px;padding-bottom:10px;border-bottom:2px solid #eef2ff;line-height:1}
.fc-section__label-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:#eef2ff;border-radius:5px;flex-shrink:0}
.fc-section__label-icon i{color:#6366f1;font-size:11px}
.fc-grid{display:grid;gap:0 20px;align-items:start}
.fc-grid--3{grid-template-columns:repeat(3,1fr)}
.fc-grid--2{grid-template-columns:repeat(2,1fr)}
.fc-col-2{grid-column:span 2}
.fc-section .form-group{margin-bottom:20px}
.fc-footer{padding:16px 28px;border-top:1px solid #e2e8f0;background:#f8fafc;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fc-footer .btn{display:inline-flex;align-items:center;gap:7px;padding:9px 22px;border-radius:8px;font-size:13px;font-weight:600;line-height:1;transition:all .15s;text-transform:none!important;letter-spacing:0!important}
.fc-footer .btn-success{background:linear-gradient(135deg,#059669,#047857)!important;color:#fff!important;border:none!important;box-shadow:0 2px 8px rgba(5,150,105,.28)!important}
.fc-footer .btn-success:hover{box-shadow:0 4px 16px rgba(5,150,105,.38)!important;transform:translateY(-1px)}
.fc-footer .btn-success[disabled],.fc-footer .btn-success.disabled{opacity:.5;cursor:not-allowed;pointer-events:none}
.fc-footer .btn-default{background:#fff!important;color:#475569!important;border:1.5px solid #cbd5e1!important;box-shadow:0 1px 3px rgba(0,0,0,.05)!important}
.fc-footer .btn-default:hover{background:#f1f5f9!important;border-color:#94a3b8!important;color:#1e293b!important;text-decoration:none}
.fc-profile-preview{width:80px;height:80px;border-radius:8px;object-fit:cover;margin-top:8px;border:2px solid #e2e8f0}
@media(max-width:992px){.fc-grid--3{grid-template-columns:repeat(2,1fr)}.fc-col-2{grid-column:span 2}}
@media(max-width:768px){.fc-grid--3,.fc-grid--2{grid-template-columns:1fr}.fc-col-2{grid-column:span 1}.fc-section{padding:20px 20px 6px}.fc-header{padding:16px 20px}.fc-footer{padding:14px 20px}}
@media(max-width:640px){.fc-section{padding:16px 16px 4px}.fc-header{padding:14px 16px}.fc-footer{padding:12px 16px}}


/* ═══════════════════════════════════════════════════
   CourseCommunity page — extracted from CourseCommunity.cshtml
   ═══════════════════════════════════════════════════ */

    /* Footer: prevent Metronic page-sidebar-fixed from fixing footer */
    .community-body.page-sidebar-fixed .footer {
        position: static !important;
        display: block !important;
        z-index: auto !important;
        width: 100%;
        margin: 0 !important;
    }

    /* Angular fade transition */
    .fade.ng-enter { transition: 0.5s linear all; opacity: 0; }
    .fade.ng-enter.ng-enter-active { opacity: 1; }

    /* ── CourseCommunity v2 design ──────────────────────────────────────────── */

    /* Outer wrapper */
    .newUI{
    padding:0 0 10px 0;
}
.postImgouter{
        text-align: center;
display: flex;
justify-content: center;
padding: 5px;
}
.postImg{
        text-align: center;
object-fit: scale-down;
height: 200px;
border: 1px solid #e6e6e6;
border-radius: 10px !important;
}

.chartDivResponse{
    display: flex;
    gap:10px;
}
    /* ── Left Sidebar ─────────────────────────────────────────────────────────── */
    .cc-desktop-sidebar {
        display: flex;
        flex-direction: column;
        border-right: 1px solid #e2e8f0;
        padding:0 10px 0 0;
        position: sticky;
    top: 0;
    height: 100vh;
    overflow: auto;
    scrollbar-width: none;
    }

    .feedDiv {
        background: #fff;
        padding: 0 0 8px 0 !important;
        flex-shrink: 0;
        border-radius: 16px !important;
        overflow: hidden;
        scrollbar-width: none;
        border:none !important;
    }

    .feedDiv::-webkit-scrollbar { width: 4px; }
    .feedDiv::-webkit-scrollbar-thumb { background: #c7d2fe; border-radius: 4px; }

    .feedLabel {
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: #6366f1 !important;
        background: #eef2ff !important;
        padding: 14px 20px !important;
        border-radius: 0 !important;
        margin-bottom: 0 !important;
        display: flex !important;
        align-items: center;
        gap: 8px;
        border-bottom: 1px solid #e0e7ff;
    }

    .feedLabel i { font-size: 14px; }

    .courseLable {
        font-size: 11px !important;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
        color: #94a3b8;
        margin: 20px 0 8px !important;
        padding: 0 16px;
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .courseLable i { font-size: 11px; color: #94a3b8; }

    .CourseList { padding: 0; }

    .courseNameDiv {
        display: flex !important;
        align-items: center;
        margin: 2px 8px !important;
        padding: 8px 12px;
        border-radius: 8px;
        text-decoration: none;
        transition: background .15s ease;
    }

    .courseNameDiv:hover { background: #f1f5f9; text-decoration: none; }

    .courseNameDiv.active-channel { background: #eef2ff; }

    .courseBox {
        height: 10px !important;
        width: 10px !important;
        border-radius: 50% !important;
        margin: 0 12px 0 0 !important;
        flex-shrink: 0;
    }

    .courseName {
        font-size: 14px !important;
        color: #334155 !important;
        font-family: inherit !important;
        font-weight: 500;
        width: auto !important;
        line-height: 1.4;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .courseNameDiv:hover .courseName { color: #6366f1 !important; }

    /* ── Page Content Area ───────────────────────────────────────────────────── */
    .pageContentdiv {
        height: auto !important;
        min-height: calc(100vh - 120px);
        background: #f8fafc !important;
        padding: 20px !important;
    }

    /* ── Post Composer ───────────────────────────────────────────────────────── */
    .startPost {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-radius: 12px !important;
        border: 1px solid #e2e8f0 !important;
        box-shadow: 0 1px 3px rgba(0,0,0,.05);
        padding: 14px 16px !important;
        background: #fff !important;
        transition: box-shadow .2s;
        margin-bottom: 16px;
        flex-wrap: wrap;
        gap: 8px;
    }

    .startPost:hover { box-shadow: 0 4px 12px rgba(99,102,241,.1); }

    .startPost1 {
        display: flex;
        align-items: center;
        flex: 1;
        min-width: 0;
        gap: 12px;
        cursor: pointer;
    }

    .sapp {
        font-size: 14px !important;
        color: #94a3b8;
        font-weight: 400;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .sapBtn {
        background: #eef2ff !important;
        color: #6366f1 !important;
        font-size: 22px !important;
        border-radius: 50% !important;
        height: 36px !important;
        width: 36px !important;
        transition: background .15s, transform .2s;
    }

    .sapBtn:hover { background: #e0e7ff !important; transform: rotate(45deg) scale(1.1); }
    .sapBtn.rotated { transform: rotate(45deg); background: #6366f1 !important; color: #fff !important; }

    /* ── Post Composer Card ──────────────────────────────────────────────── */
    .sapNew {
        background: #fff;
        border-radius: 14px;
        border: 1px solid #e2e8f0;
        margin-bottom: 20px;
        box-shadow: 0 2px 12px rgba(99,102,241,.08);
        position: relative;
    }

    /* Context bar: course info + notification bell */
    .sapNew__context {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 16px;
        background: #f8faff;
        border-bottom: 1px solid #eaecf5;
        gap: 12px;
    }

    .sapNew__context-info {
        display: flex;
        align-items: center;
        gap: 10px;
        min-width: 0;
        flex: 1;
    }

    .sapNew__context-text {
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    .sapNew__course-title {
        font-size: 13px;
        font-weight: 600;
        color: #1e293b;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .sapNew__stats { font-size: 11px; color: #94a3b8; margin-top: 2px; }

    .sapNew__notif-btn {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #64748b;
        font-size: 16px;
        padding: 6px 8px;
        border-radius: 8px;
        transition: background .15s, color .15s;
        text-decoration: none !important;
        flex-shrink: 0;
    }
    .sapNew__notif-btn i{
        font-size: 16px;
    }

    .sapNew__notif-btn:hover { background: #eef2ff; color: #6366f1; }
    .sapNew__notif-btn:hover .fa-bell { animation: notif-ring .4s ease; }

    @keyframes notif-ring {
        0%,100% { transform: rotate(0); }
        20%      { transform: rotate(-18deg); }
        50%      { transform: rotate(16deg); }
        75%      { transform: rotate(-10deg); }
    }

    .sapNew__notif-badge {
        position: absolute;
        top: 1px;
        right: 1px;
        background: #ef4444;
        color: #fff;
        font-size: 9px;
        font-weight: 700;
        height: 15px;
        min-width: 15px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 3px;
        line-height: 1;
    }

    /* ── Notification panel dropdown ─────────────────────────────────── */
    .notif-panel {
        padding: 0 !important;
        border-radius: 14px !important;
        border: 1px solid #e2e8f0 !important;
        box-shadow: 0 10px 36px rgba(15,23,42,.13) !important;
        min-width: 360px !important;
        max-width: 400px !important;
        overflow: hidden;
        margin-top: 8px !important;
        z-index: 9999 !important;
    }

    .notif-panel__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 13px 16px 11px;
        border-bottom: 1px solid #f1f5f9;
        background: #fff;
    }

    .notif-panel__title {
        display: flex;
        align-items: center;
        gap: 7px;
        font-size: 13px;
        font-weight: 700;
        color: #1e293b;
        margin: 0;
    }

    .notif-panel__title .fa { color: #6366f1; font-size: 14px; }

    .notif-panel__count {
        background: #eef2ff;
        color: #6366f1;
        font-size: 10px;
        font-weight: 700;
        padding: 1px 7px;
        border-radius: 20px;
        line-height: 18px;
        white-space: nowrap;
    }

    .notif-panel__list {
        list-style: none;
        padding: 0;
        margin: 0;
        max-height: 272px;
        overflow-y: auto;
    }

    .notif-panel__list::-webkit-scrollbar { width: 4px; }
    .notif-panel__list::-webkit-scrollbar-track { background: #f8fafc; }
    .notif-panel__list::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

    .notif-panel__item {
        display: flex !important;
        align-items: flex-start !important;
        gap: 10px !important;
        padding: 10px 16px !important;
        border-bottom: 1px solid #f8fafc !important;
        transition: background .15s;
        cursor: default;
    }

    .notif-panel__item:hover { background: #f8faff !important; }
    .notif-panel__item:last-child { border-bottom: none !important; }

    .notif-panel__dot {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #6366f1;
        flex-shrink: 0;
        margin-top: 5px;
    }

    .notif-panel__text {
        flex: 1;
        min-width: 0;
        font-size: 12px;
        color: #334155;
        line-height: 1.55;
        word-break: break-word;
    }

    .notif-panel__time {
        font-size: 10px;
        color: #94a3b8;
        white-space: nowrap;
        flex-shrink: 0;
        margin-top: 3px;
    }

    .notif-panel__empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 28px 16px;
        color: #94a3b8;
        gap: 8px;
        font-size: 12px;
    }

    .notif-panel__empty .fa { font-size: 26px; color: #e2e8f0; }

    /* Composer body: avatar + editable area */
    .sapNew__body {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 16px 16px 10px;
    }

    .sapNew__avatar {
        height: 38px;
        width: 38px;
        border-radius: 50%;
        border: 2px solid #e0e7ff;
        object-fit: cover;
        flex-shrink: 0;
        margin-top: 2px;
    }

    .sapNew__editor { flex: 1; min-width: 0; background: azure; border-radius: 20px !important; padding: 6px 10px; }

    .sapNew__textarea {
        min-height: 72px !important;
        padding: 10px 12px !important;
        font-size: 14px;
        line-height: 1.6;
    }

    #htmlContent:empty::before {
        content: attr(data-text);
        color: #94a3b8;
        pointer-events: none;
        cursor: text;
        display: block;
    }

    /* Attached-file preview strip */
    .sapNew__preview {
        padding: 0 16px 10px;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: flex-start;
    }

    /* Footer: tags (left) — attach + submit (right) */
    .sapNew__footer {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding: 10px 16px 14px;
        gap: 10px;
        flex-wrap: wrap;
        border-top: 1px solid #f1f5f9;
    }

    .sapNew__tags { flex: 1; min-width: 140px; }

    .sapNew__actions {
        display: flex;
        align-items: center;
        gap: 0;
        flex-shrink: 0;
    }

    .sapNew__attach {
        display: flex;
        align-items: center;
        gap: 8px;
        padding-right: 12px;
        margin-right: 12px;
        border-right: 1px solid #e2e8f0;
    }

    .sapNew__submit {
        border-radius: 8px !important;
        display: inline-flex !important;
        align-items: center;
        gap: 6px;
        float: none !important;
    }

    .postCommentDiv { flex: 1; min-width: 0; }

    .postcommBtn {
        background: #6366f1 !important;
        color: #fff !important;
        border: none !important;
        font-size: 13px !important;
        padding: 6px 18px !important;
        font-weight: 600;
        transition: background .15s, transform .15s;
    }

    .postcommBtn:hover { background: #4f46e5 !important; color: #fff !important; border: none !important; transform: translateY(-1px); }

    /* ── Feed Post Cards ─────────────────────────────────────────────────────── */
    .postDiv {
        background: #fff !important;
        border-radius: 20px !important;
        border: none !important;
        padding: 0 !important;
        margin: 22px 0 !important;
        box-shadow: 0 4px 24px rgba(99,102,241,.09), 0 1px 4px rgba(0,0,0,.04) !important;
        transition: box-shadow .22s, transform .18s;
        overflow: hidden;
        position: relative;
    }

    .postDiv:hover {
        box-shadow: 0 10px 40px rgba(99,102,241,.16), 0 2px 8px rgba(0,0,0,.06) !important;
        transform: translateY(-3px);
    }

    /* gradient header zone — makes each post feel distinct */
    .postDivHeader {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16px 18px 14px;
        background: linear-gradient(135deg, #f0f1ff 0%, #f7f8ff 60%, #fff 100%);
    }

    .postDivHp1 {
        display: flex;
        align-items: center;
        gap: 12px;
        min-width: 0;
        flex: 1;
    }

    /* avatar with double-ring glow */
    .profilep {
        height: 46px !important;
        width: 46px !important;
        border-radius: 50% !important;
        border: none !important;
        margin: 0 !important;
        object-fit: cover;
        flex-shrink: 0;
        box-shadow: 0 0 0 2px #fff, 0 0 0 4px #a5b4fc;
    }

    .profileName {
        font-size: 15px !important;
        font-weight: 700;
        color: #1e293b;
        margin: 0 0 2px !important;
        line-height: 1.2;
        letter-spacing: -.01em;
    }

    .PiG { margin: 0 !important; display: flex; align-items: center; }

    .datePosted {
        color: #94a3b8 !important;
        font-size: 11px !important;
    }

    .postDivHp2 { flex-shrink: 0; }
    .postDivHp2 i {
        color: #94a3b8 !important;
        font-size: 17px;
        cursor: pointer;
        padding: 6px 8px;
        border-radius: 8px;
        transition: background .15s, color .15s;
    }
    .postDivHp2 i:hover { background: rgba(99,102,241,.1); color: #6366f1 !important; }

    /* post body — clean white */
    .postContent {
        font-size: 15px !important;
        color: #1e293b;
        line-height: 1.72;
        margin: 0 !important;
        padding: 14px 20px 20px;
        word-break: break-word;
    }

    /* reaction bar — tinted background, pill action buttons */
    .postDivFooter {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 16px;
        border-top: 1px solid #eef0ff;
        margin: 0 !important;
        background: linear-gradient(90deg, #f8f9ff 0%, #f5f3ff 100%);
    }

    .postDivFp1 { display: flex; align-items: center; gap: 6px; }

    .postDivFp1 i {
        cursor: pointer;
        font-size: 14px !important;
        transition: transform .15s;
    }

    /* like button pill */
    .postDivFp1 .fa-heart-o,
    .postDivFp1 .fa-heart {
        color: #94a3b8;
        padding: 6px 7px;
        border-radius: 8px;
        background: #fff;
        border: 1px solid #e2e8f0;
        transition: color .15s, background .15s, border-color .15s, transform .15s;
    }
    .postDivFp1 .fa-heart-o:hover { color: #f43f5e; background: #fff1f2; border-color: #fecdd3; transform: scale(1.15); }
    .postDivFp1 .fa-heart.red-active,
    .postDivFp1 i.red-active { color: #f43f5e !important; background: #fff1f2 !important; border-color: #fecdd3 !important; }

    /* comment button pill */
    .postDivFp1 .fa-comment-o {
        color: #94a3b8;
        padding: 6px 7px;
        border-radius: 8px;
        background: #fff;
        border: 1px solid #e2e8f0;
        transition: color .15s, background .15s, border-color .15s;
    }
    .postDivFp1 .fa-comment-o:hover { color: #6366f1; background: #eef2ff; border-color: #c7d2fe; }

    .postDivFp1 p {
        font-size: 12px !important;
        font-weight: 600;
        color: #64748b;
        margin: 0 6px 0 3px !important;
        cursor: pointer;
    }

    .viewMore {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        font-size: 12px !important;
        font-weight: 600;
        color: #6366f1 !important;
        background: #fff;
        border: 1px solid #c7d2fe;
        border-radius: 20px;
        padding: 5px 14px;
        cursor: pointer;
        transition: background .15s, border-color .15s, color .15s;
        text-decoration: none !important;
    }
    .viewMore:hover { background: #eef2ff; border-color: #a5b4fc; color: #4f46e5 !important; }

    /* ── Comment Section ─────────────────────────────────────────────────────── */
    /* ── Comment Section ─────────────────────────────────────────────────────── */
    .commentDiv {
        padding: 20px !important;
        border-top: 1px solid #eef0ff;
        background: #f7f8ff;
    }
    .commentDiv hr { display: none; }

    /* smaller avatars inside the comment thread */
    .commentDivcontent .profilep {
        height: 32px !important;
        width: 32px !important;
        box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #c7d2fe;
        margin-top: 2px;
        flex-shrink: 0;
    }

    /* ── compose bar (write comment) ── */
    .cc-compose {
        padding: 12px 16px 10px;
        background: #eef0ff;
        border-bottom: 1px solid #dde0ff;
    }

    .cc-compose-wrap {
        flex: 1;
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 8px;
        background: #fff;
        border: 1.5px solid #dde0ff;
        border-radius: 24px;
        padding: 4px 4px 4px 14px;
        transition: border-color .15s, box-shadow .15s;
    }

    .cc-compose-wrap:focus-within {
        border-color: #a5b4fc;
        box-shadow: 0 0 0 3px rgba(99,102,241,.1);
    }

    .cc-compose .commInp {
        flex: 1;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        padding: 6px 0 !important;
        font-size: 13px !important;
        color: #1e293b !important;
        outline: none !important;
        box-shadow: none !important;
        width: 100%;
    }

    .cc-send-btn {
        background: #6366f1 !important;
        color: #fff !important;
        border: none !important;
        border-radius: 50% !important;
        height: 30px !important;
        width: 30px !important;
        min-width: 30px;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        font-size: 12px !important;
        transition: background .15s, transform .15s;
        flex-shrink: 0;
        cursor: pointer;
    }
    .cc-send-btn:hover { background: #4f46e5 !important; transform: scale(1.1); }

    /* ── existing comment bubble row ── */
    .commentDivcontent {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 10px 16px 2px;
    }

    .commentDivcontent > div { min-width: 0;  }
    .commentDivcontent .mr-auto{
        flex-grow: 1;
    }

    .commentDivcontent .profileName {
        font-size: 12px !important;
        font-weight: 700;
        color: #1e293b;
        margin: 0 !important;
        display: inline;
    }

    .commentDivcontent .datePosted { margin-left: 6px !important; }

    .commentDivcontent .postContent {
        background: #fff;
        border: 1px solid #e4e7ff;
        border-radius: 4px 14px 14px 14px;
        padding: 8px 13px !important;
        margin-top: 4px !important;
        font-size: 13px !important;
        display: block;
        color: #334155 !important;
        line-height: 1.56;
        box-shadow: 0 1px 4px rgba(99,102,241,.07);
    }

    /* ── comment action bar ── */
    .commDivFooter {
        padding: 3px 16px 8px 58px;
        display: flex;
        align-items: center;
    }

    .commDivFooter .postDivFp1 { gap: 1px; }

    .commDivFooter .postDivFp1 i {
        font-size: 11px !important;
        color: #94a3b8;
        padding: 3px 6px;
        border-radius: 4px;
        background: transparent;
        border: none;
        transition: color .15s, background .15s;
    }

    .commDivFooter .postDivFp1 i:hover { background: #eef2ff; transform: none; }
    .commDivFooter .postDivFp1 .fa-heart-o:hover { color: #f43f5e; background: #fff1f2; }
    .commDivFooter .postDivFp1 .fa-comment-o:hover { color: #6366f1; }

    .commDivFooter .postDivFp1 p {
        font-size: 11px !important;
        color: #94a3b8;
        margin: 0 6px 0 1px !important;
        font-weight: 500;
        cursor: pointer;
    }

    /* ── reply thread indent + left border line ── */
    .cc-comment-indent { padding-left: 42px !important; margin: 0 !important; }

    .cc-reply-indent {
        margin-left: 58px;
        padding-left: 12px;
        border-left: 2px solid #dde0ff;
        margin-top: 2px;
        padding-bottom: 4px;
    }

    .postcommFooter { display: flex; justify-content: flex-end; margin-top: 6px; }

    .ddr { border-radius: 12px !important; border: 1px solid #e2e8f0 !important; box-shadow: 0 8px 24px rgba(15,23,42,.11) !important; padding: 4px 0 !important; }
    .delPost { padding: 9px !important; cursor: pointer; font-size: 13px; color: #ef4444 !important; display: flex !important; align-items: center; gap: 3px; }
    .delPost i{
        padding: 0;
    }
    .delPost:hover i{
        color:#ef4444;
    }
    .delPost:hover { background: #fef2f2 !important; }

   .viewQuizmodBody input:where([type=radio]){
        border-radius: 50% !important;
    }
    .viewQuizmodBody .video-checkbox, .viewQuizmodBody .video-radio{
        display: flex;
        align-items: center;
        gap: 5px;
    }

    
    /* ── Members Panel ──────────────────────────────────────────────────────── */
    .adminNusers {
        margin-top: 18px !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 16px !important;
        background: #fff !important;
        box-shadow: 0 4px 18px rgba(99,102,241,.08), 0 1px 4px rgba(0,0,0,.04) !important;
        overflow: hidden;
        flex-shrink: 0;
    }

    /* Panel header strip */
    .pnl-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 13px 16px 11px;
        background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 60%, #faf9ff 100%);
        border-bottom: 1px solid #e4e7ff;
    }

    .pnl-header__title {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .07em;
        color: #1e293b;
        margin: 0;
    }

    .pnl-header__title .fa { color: #6366f1; font-size: 13px; }

    .pnl-header__count {
        background: #6366f1;
        color: #fff;
        font-size: 10px;
        font-weight: 700;
        padding: 2px 9px;
        border-radius: 20px;
        line-height: 18px;
    }

    /* Search */
    .pnl-search {
        padding: 10px 14px 6px;
        border-bottom: 1px solid #f1f5f9;
    }

    .pnl-search-wrap {
        position: relative;
        display: flex;
        align-items: center;
    }

    .pnl-search-icon {
        position: absolute;
        left: 11px;
        color: #94a3b8;
        font-size: 11px;
        pointer-events: none;
    }

    .userSearch {
        border: 1px solid #e2e8f0 !important;
        border-radius: 20px !important;
        font-size: 12px !important;
        padding: 7px 12px 7px 30px !important;
        color: #334155;
        width: 100%;
        background: #f8fafc;
        transition: border-color .15s, box-shadow .15s;
        outline: none;
    }

    .userSearch:focus { border-color: #a5b4fc !important; box-shadow: 0 0 0 3px rgba(99,102,241,.1) !important; background: #fff; }

    /* Section labels (Instructors / Learners) */
    .adminTitle {
        display: flex !important;
        align-items: center !important;
        gap: 7px !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        text-transform: uppercase;
        letter-spacing: .07em;
        color: #64748b !important;
        margin: 0 !important;
        padding: 10px 16px 6px !important;
        border-bottom: none !important;
    }

    .adminTitle i { font-size: 10px; color: #94a3b8; }

    /* User rows */
    .ppNstatus {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 6px 14px;
        margin: 0 !important;
        transition: background .15s;
        cursor: default;
    }

    .ppNstatus:hover { background: #f8fafc; }

    .profilep2 {
        height: 34px !important;
        width: 34px !important;
        border-radius: 50% !important;
        overflow: hidden;
        flex-shrink: 0;
        box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #c7d2fe;
    }

    .profilep2 img { border-radius: 50% !important; width: 100%; height: 100%; object-fit: cover; }

    .profileName2 {
        font-size: 12px !important;
        font-weight: 500;
        color: #334155;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Online / offline status dots */
    .statusDotg {
        position: absolute;
        height: 9px !important; width: 9px !important;
        background: #22c55e !important;
        bottom: 0 !important; right: 0 !important;
        border: 1.5px solid #fff;
        border-radius: 50%;
    }

    .statusDoto {
        position: absolute;
        height: 9px !important; width: 9px !important;
        background: #cbd5e1 !important;
        bottom: 0 !important; right: 0 !important;
        border: 1.5px solid #fff;
        border-radius: 50%;
    }

    /* Online / Offline section pill labels */
    .cc-label-online {
        display: inline-flex; align-items: center; gap: 5px;
        font-size: 10px; font-weight: 700; text-transform: uppercase;
        letter-spacing: .06em; color: #16a34a;
        background: #dcfce7; padding: 2px 10px; border-radius: 20px;
        margin: 4px 14px 0;
    }

    .cc-label-offline {
        display: inline-flex; align-items: center; gap: 5px;
        font-size: 10px; font-weight: 700; text-transform: uppercase;
        letter-spacing: .06em; color: #64748b;
        background: #f1f5f9; padding: 2px 10px; border-radius: 20px;
        margin: 8px 14px 0;
    }

    .cc-label-online .cc-fa-dot, .cc-label-offline .cc-fa-dot { font-size: 7px; }

    .adminNusersHr { display: none; }

    /* ── Scrollable right panel ──────────────────────────────────────────────── */
    .scrollAble {
        height: calc(100vh - 160px);
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #c7d2fe transparent;
    }

    .scrollAble::-webkit-scrollbar { width: 4px; }
    .scrollAble::-webkit-scrollbar-thumb { background: #c7d2fe; border-radius: 4px; }

    /* ── New Post button in header ───────────────────────────────────────────── */
    .pageTitleDivp2 button {
        background: linear-gradient(135deg, #6366f1, #4f46e5) !important;
        border-radius: 999px !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: .02em;
        padding: 9px 20px !important;
        font-family: inherit !important;
        box-shadow: 0 2px 8px rgba(99,102,241,.35);
        transition: box-shadow .15s, transform .15s;
    }

    .pageTitleDivp2 button:hover { box-shadow: 0 6px 18px rgba(99,102,241,.45); transform: translateY(-1px); }

    /* ── Back button ─────────────────────────────────────────────────────────── */
    .backBtn {
        background: #f1f5f9 !important;
        color: #334155 !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 999px !important;
        font-size: 13px !important;
        font-weight: 600;
        padding: 8px 18px !important;
        font-family: inherit !important;
        box-shadow: 0 1px 3px rgba(0,0,0,.05);
        transition: background .15s, box-shadow .15s;
    }

    .backBtn:hover { background: #e2e8f0 !important; color: #1e293b !important; text-decoration: none; box-shadow: 0 4px 12px rgba(0,0,0,.1); }
    .backBtn span { font-size: 16px !important; margin-right: 4px; }

    /* ── Page title bar ──────────────────────────────────────────────────────── */
    .pageTitleDiv {
        background: #fff !important;
        border-bottom: 1px solid #e2e8f0 !important;
        padding: 14px 20px !important;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    .pageTitleName {
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #1e293b !important;
        display: flex !important;
        align-items: center;
        gap: 10px;
        margin: 0 !important;
        font-family: inherit !important;
    }

    .pageTitleName i { font-size: 22px !important; color: #6366f1; }

    /* ── Post image / media sizing ──────────────────────────────────────────── */
    .postContent img {
        max-width: 100%;
        max-height: 400px;
        width: auto;
        height: auto;
        border-radius: 12px;
        display: block;
        margin-top: 12px;
        object-fit: contain;
        box-shadow: 0 2px 12px rgba(0,0,0,.08);
    }

    .postContent iframe {
        max-width: 100%;
        border-radius: 12px;
        display: block;
        margin-top: 12px;
        box-shadow: 0 2px 12px rgba(0,0,0,.08);
    }

    .commentDivcontent .postContent img { display: none; }

    /* ── Attachments icon bar ────────────────────────────────────────────────── */
    .attIcons { color: #6366f1 !important; font-size: 20px !important; transition: color .15s; }
    .attIcons:hover { color: #4f46e5 !important; }

    /* ── Post actions (dropdown, etc.) ──────────────────────────────────────── */
    .postDivHp2 i { color: #94a3b8 !important; }

    /* ── Off-canvas sidebar (mobile only) ───────────────────────────────────── */
    .open-btn {
        display: flex;
        align-items: center;
        gap: 6px;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 8px 14px;
        font-size: 13px;
        font-weight: 600;
        color: #334155;
        cursor: pointer;
        margin-bottom: 12px;
    }

    .off-canvas {
        position: fixed;
        left: 0;
        top: 0;
        height: 100vh;
        width: 260px;
        background: #fff;
        z-index: 1000;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        box-shadow: 4px 0 20px rgba(0,0,0,.12);
        overflow-y: auto;
    }

    .off-canvas.show { transform: translateX(0); }

    .overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.4);
        z-index: 999;
    }

    .overlay.show { display: block; }

    /* Desktop: hide open-btn and off-canvas, show the inline sidebar */
    @media (min-width: 1025px) {
        .open-btn { display: none !important; }
        #offCanvas { display: none !important; }
        #overlay { display: none !important; }
        .cc-desktop-sidebar { display: block !important; }
    }

    /* ── Responsive adjustments ──────────────────────────────────────────────── */
    @media (max-width: 1024px) {
        .cc-desktop-sidebar { display: none !important; }
        .feedDiv { height: auto; min-height: 0; border-right: none; border-bottom: 1px solid #e2e8f0; }
        .scrollAble { height: auto; overflow-y: visible; }
        .pageContentdiv { padding: 12px !important; }
    }

    @media (max-width: 768px) {
        .pageContentdiv { padding: 10px !important; }
        .postDiv { padding: 14px !important; }
        .adminNusers { margin-top: 16px; }
        .pageTitleDiv { padding: 10px 14px !important; }
        .pageTitleName { font-size: 16px !important; }
        .pageTitleDivp2 button { font-size: 12px !important; padding: 7px 14px !important; }
        .backBtn { font-size: 12px !important; padding: 6px 14px !important; }
    }

    /* ── Helper classes replacing inline styles ─────────────────────────────── */
    .cc-page-header-override {
        border-radius: 0 !important;
        margin-bottom: 0 !important;
        border-top: none !important;
        border-bottom: 1px solid #e0e7ff !important;
        box-shadow: none !important;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    .cc-offcanvas-feed { height: 100% !important; border-right: none !important; padding-top: 0 !important; }

    .sapH { display: flex; align-items: center; padding: 10px 0 6px; }
    .sapH_info { display: flex; align-items: center; gap: 12px; flex: 1; }

    .cc-course-thumb {
        height: 40px;
        width: 40px;
        border-radius: 8px;
        object-fit: cover;
        border: 1px solid #e2e8f0;
        flex-shrink: 0;
    }

    .cc-notif-scroller { height: 250px; overflow-y: auto; }

    .cc-comment-indent { padding-left: 10%; margin: 10px 0; }
    .cc-reply-indent { padding-left: 10%; margin: 10px 0; position: relative; }

    .cc-video-post { width: 500px; max-width: 100%; }

    .cc-label-online {
        font-size: 10px; font-weight: 700; text-transform: uppercase;
        letter-spacing: .06em; color: #22c55e; padding: 0 8px;
    }
    .cc-label-online .cc-fa-dot { font-size: 8px; }

    .cc-label-offline {
        font-size: 10px; font-weight: 700; text-transform: uppercase;
        letter-spacing: .06em; color: #94a3b8; padding: 0 8px;
    }
    .cc-label-offline .cc-fa-dot { font-size: 8px; }

    .cc-badge-compact { font-size: 10px !important; padding: 2px 8px !important; margin-left: auto; }
    .cc-badge-instructor { font-size: 10px !important; padding: 2px 6px !important; }

    .close-btn {
        background: transparent; border: none; color: #334155;
        font-size: 22px; position: absolute; top: 10px; right: 12px; cursor: pointer;
    }

    /* ── Video Embed Modal ───────────────────────────────────────────────────── */
    #downloadModalVideo .modal-dialog {
        max-width: 460px;
        margin: 80px auto;
    }

    #downloadModalVideo .modal-content {
        border: none !important;
        border-radius: 20px !important;
        overflow: hidden;
        box-shadow: 0 24px 64px rgba(15,23,42,.22), 0 4px 16px rgba(99,102,241,.12);
    }

    #downloadModalVideo .modal-header, #lightboxModal .modal-header{
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 18px 22px 16px !important;
        background: linear-gradient(135deg, #eef0ff 0%, #faf9ff 100%);
        border-bottom: 1px solid #e4e7ff !important;
    }

    #downloadModalVideo .modal-title, #lightboxModal .modal-title{
        font-size: 15px !important;
        font-weight: 700 !important;
        color: #1e293b !important;
        display: flex;
        align-items: center;
        gap: 10px;
        margin: 0 !important;
    }

    .mv-modal__icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 34px;
        height: 34px;
        background: #fff;
        border: 1px solid #e0e3ff;
        border-radius: 10px;
        color: #ef4444;
        font-size: 16px;
        box-shadow: 0 1px 4px rgba(99,102,241,.1);
        flex-shrink: 0;
    }

    .mv-modal__close {
        float: none !important;
        background: transparent !important;
        border: none !important;
        color: #94a3b8 !important;
        font-size: 14px !important;
        width: 32px;
        height: 32px;
        border-radius: 8px;
        cursor: pointer;
        opacity: 1 !important;
        transition: background .15s, color .15s;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
        flex-shrink: 0;
    }

    .mv-modal__close:hover { background: #fee2e2 !important; color: #ef4444 !important; opacity: 1 !important; }

    #downloadModalVideo .modal-body {
        padding: 24px 22px 18px !important;
        background: #fff;
    }

    .mv-modal__label {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 11px;
        font-weight: 700;
        color: #475569;
        text-transform: uppercase;
        letter-spacing: .06em;
        margin: 0 0 8px !important;
    }

    .quizTypeRadio{
        border: 1px solid #cbd5e1;
    padding: 5px 10px;
    border-radius: 10px;
    display: flex;
    width: fit-content;
    align-items: center;
    gap: 5px;
    }

    .mv-modal__label .fa { color: #6366f1; }

    .mv-modal__textarea {
        width: 100% !important;
        border: 1.5px solid #dde0ff !important;
        border-radius: 12px !important;
        padding: 12px 14px !important;
        font-size: 13px !important;
        color: #334155 !important;
        background: #f8f9ff !important;
        resize: vertical;
        min-height: 90px;
        transition: border-color .15s, box-shadow .15s, background .15s;
        outline: none !important;
        line-height: 1.6;
        display: block;
        box-shadow: none !important;
    }

    .mv-modal__textarea:focus {
        border-color: #a5b4fc !important;
        background: #fff !important;
        box-shadow: 0 0 0 3px rgba(99,102,241,.1) !important;
    }

    .mv-modal__hint {
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 11px;
        color: #94a3b8;
        margin: 8px 0 0 !important;
    }

    .mv-modal__hint .fa { color: #a5b4fc; font-size: 12px; }

    #downloadModalVideo .modal-footer {
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
        padding: 14px 22px !important;
        background: #f8f9ff !important;
        border-top: 1px solid #eef0ff !important;
    }

    /* ── Delete confirmation overlay ────────────────────────────────────── */
    .del-confirm-overlay {
        position: fixed;
        inset: 0;
        background: rgba(15,23,42,.55);
        backdrop-filter: blur(3px);
        z-index: 11000;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        pointer-events: none;
        transition: opacity .22s ease;
    }

    .del-confirm-overlay.del-confirm--visible {
        opacity: 1;
        pointer-events: all;
    }

    .del-confirm-dialog {
        background: #fff;
        border-radius: 20px;
        width: 100%;
        max-width: 380px;
        margin: 0 16px;
        box-shadow: 0 24px 60px rgba(15,23,42,.22), 0 4px 16px rgba(239,68,68,.12);
        transform: scale(.88) translateY(16px);
        transition: transform .25s cubic-bezier(.34,1.56,.64,1);
        overflow: hidden;
        text-align: center;
    }

    .del-confirm-overlay.del-confirm--visible .del-confirm-dialog {
        transform: scale(1) translateY(0);
    }

    .del-confirm-top {
        background: linear-gradient(135deg, #fff1f2 0%, #fdf2f8 100%);
        padding: 28px 24px 20px;
        border-bottom: 1px solid #fee2e2;
    }

    .del-confirm-icon-wrap {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background: #fee2e2;
        border: 3px solid #fecaca;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 14px;
    }

    .del-confirm-icon-wrap .fa {
        font-size: 22px;
        color: #ef4444;
    }

    .del-confirm-title {
        font-size: 17px;
        font-weight: 700;
        color: #1e293b;
        margin: 0 0 6px;
    }

    .del-confirm-msg {
        font-size: 13px;
        color: #64748b;
        margin: 0;
        line-height: 1.6;
    }

    .del-confirm-actions {
        display: flex;
        gap: 10px;
        padding: 18px 20px;
        background: #fff;
    }

    .del-confirm-cancel {
        flex: 1;
        height: 40px;
        border: 1.5px solid #e2e8f0;
        background: #fff;
        border-radius: 10px;
        font-size: 13px;
        font-weight: 600;
        color: #475569;
        cursor: pointer;
        transition: background .15s, border-color .15s;
    }

    .del-confirm-cancel:hover { background: #f8fafc; border-color: #cbd5e1; }

    .del-confirm-delete {
        flex: 1;
        height: 40px;
        border: none;
        background: #ef4444;
        border-radius: 10px;
        font-size: 13px;
        font-weight: 700;
        color: #fff;
        cursor: pointer;
        transition: background .15s, transform .15s, box-shadow .15s;
        box-shadow: 0 3px 10px rgba(239,68,68,.3);
    }

    .del-confirm-delete:hover { background: #dc2626; transform: translateY(-1px); box-shadow: 0 5px 14px rgba(239,68,68,.4); }

    /* ── Scroll-to-top button ────────────────────────────────────────────── */
    #scrollTopBtn {
        position: fixed;
        bottom: 32px;
        right: 32px;
        width: 48px;
        height: 48px;
        border-radius: 50% !important;
        background: #1e3a8a;
        color: #fff;
        border: none;
        font-size: 17px;
        cursor: pointer;
        display: none;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 18px rgba(30,58,138,.38);
        z-index: 10000;
        transition: background .2s, transform .2s, box-shadow .2s;
        outline: none;
    }
    #scrollTopBtn:hover { background: #1d4ed8; transform: translateY(-3px); box-shadow: 0 8px 28px rgba(30,58,138,.48); }
    #scrollTopBtn.stt-visible { display: inline-flex; }
/* ── UserGeneralLearningPlanDetails (lp-*) ──────────────────────────────────── */
.lp-item{position:relative}
.lp-done-badge{position:absolute;top:8px;left:8px;background:#16a34a;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;box-shadow:0 2px 8px rgba(0,0,0,.18);z-index:2}
.lp-hero{display:flex;gap:24px;padding:24px;align-items:flex-start;background:linear-gradient(135deg,#eef2ff 0%,#f5f7ff 55%,#ffffff 100%);border-bottom:1px solid #e2e8f0}
.lp-hero__img{flex:0 0 220px;max-width:220px}
.lp-hero__img img{width:100%;border-radius:8px;object-fit:cover;aspect-ratio:16/9;display:block}
.lp-hero__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.lp-hero__title{font-size:20px;font-weight:700;color:#1e293b;margin:0;line-height:1.3}
/* ── lp-learner — prominent learner identity card inside lp-hero ─────────── */
.lp-learner{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#eef2ff 0%,#f0f9ff 100%);border:1px solid #c7d2fe;border-radius:12px;padding:12px 16px;margin-top:4px}
.lp-learner__avatar{width:48px;height:48px;border-radius:50% !important;object-fit:cover;flex-shrink:0;border:2px solid #6366f1;box-shadow:0 0 0 3px #e0e7ff}
.lp-learner__info{display:flex;flex-direction:column;gap:2px;min-width:0}
.lp-learner__label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#6366f1}
.lp-learner__name{font-size:15px;font-weight:700;color:#1e293b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-learner__email{font-size:12px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-learner__email i{color:#94a3b8;margin-right:3px}
/* ── lp-two-col — 2-column layout inside tbl-panel (learner left, plan details right) ─────────── */
.lp-two-col{display:grid;grid-template-columns:260px 1fr;gap:24px;padding:20px;align-items:start}
.lp-two-col__learner{display:flex;flex-direction:column;gap:12px}
.lp-two-col__learner .lp-learner{flex-direction:column;align-items:center;text-align:center;padding:20px 16px;margin-top:0;position:relative}
.lp-learner__enrolled{position:absolute;top:8px;right:8px;background:#dcfce7;color:#15803d;border:1px solid #bbf7d0;border-radius:20px;padding:2px 8px;font-size:11px;font-weight:700;line-height:1.4}
.lp-two-col__learner .lp-learner__avatar{width:72px;height:72px}
.lp-two-col__learner .lp-learner__info{align-items:center}
.lp-two-col__details{min-width:0}
.lp-two-col__details .lp-hero{padding:0}
.lp-two-col__details .lp-hero__img{flex:0 0 140px;max-width:140px}
@media(max-width:768px){.lp-two-col{grid-template-columns:1fr;padding:16px;gap:16px}}
/* lst-horizontal as a sub-section inside tbl-panel — inset padding so items don't bleed edge-to-edge */
.tbl-panel .lst-horizontal{padding:20px;gap:12px;background:#f8fafc}
.tbl-panel .lst-horizontal .lst-horizontal__item{box-shadow:0 1px 6px rgba(0,0,0,.06);min-height:310px;max-height: stretch;height: stretch;}
.tbl-panel .lst-horizontal .lst-horizontal__body{padding-bottom:20px;min-height:200px}
.lst-horizontal .form-message-box{background:#eff6ff;border:1px solid #bfdbfe;border-left:3px solid #3b82f6;border-radius:8px;color:#1e40af;padding:10px 14px;font-size:12px;font-weight:500;letter-spacing:0;text-align:left;margin-bottom:6px}
/* ng-if wrapper divs inside lst-horizontal__actions must flex-wrap so buttons never overflow the card */
.lst-horizontal__actions > div{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
.lst-horizontal__actions > div > div{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
@media(max-width:640px){.lp-hero{flex-direction:column;padding:16px}.lp-hero__img{flex:none;max-width:100%;width:100%}}
@media(max-width:640px){.tbl-panel .lst-horizontal{padding:12px;gap:10px}}


/* ── Pre-Assessment Evaluations — shared quiz evaluation page styles ────────── */
html, body {
            scroll-behavior: smooth !important;
        }

        .preassesmentpage ul.list-unstyled:not(.orderingqu) {
            display: flex;
        }

        .preassesmentpage .qt25 ul.list-unstyled {
            display: initial !important;
        }

        .BreadCrumb {
            margin-bottom: 2.5rem;
        }

            .BreadCrumb h4 {
                font-family: "Inter", sans-serif;
                font-size: 25px;
                font-weight: 600;
                text-transform: capitalize;
                letter-spacing: normal;
                word-spacing: normal;
            }

            .BreadCrumb p {
                color: #6b7280;
                font-size: 14px;
                margin-top: 4px;
                font-family: "Inter", sans-serif;
                letter-spacing: normal;
            }

        .infoCard {
            background-color: white;
            border-radius: 16px !important;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            padding: 1.5rem;
            position: relative;
            /*overflow: hidden;*/
            transition: all 0.3s ease;
            margin-bottom: 1.5rem;
            display: flex;
            align-items: center;
            border: 1px solid #e5e7eb;
        }

        .custom-select-wrapper {
            width: 200px;
            font-size: 14px;
        }

        .custom-select-dropdown {
            left: 0;
            top: 38px;
            border-radius: 20px;
        }

        .selected-item {
            padding: 8px 12px;
            border: 1px solid #ccc;
            background: #f9f9f9;
            border-radius: 4px;
        }

        .custom-select-dropdown .dropdown-item:hover {
            background-color: #f1f1f1;
        }


        .studentAvatar {
            width: 80px;
            height: 80px;
            border-radius: 50% !important;
            background-color: #6366f1;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 28px;
            font-weight: 700;
            color: white;
            flex-shrink: 0;
            margin-right: 1.5rem;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            font-family: "Inter", sans-serif;
        }

        .stuFlexDiv {
            display: flex;
            justify-content: space-between;
            width: -webkit-fill-available;
        }

        .studentName {
            font-size: 24px;
            font-weight: 700;
            color: #111827;
            letter-spacing: -0.6px;
            margin-bottom: 8px;
            font-family: "Inter", sans-serif;
            margin-top: 0px;
        }

        .NOA {
            display: flex;
            align-items: center;
            font-size: 14px;
            color: #6b7280;
            margin-bottom: 16px;
            gap: 0.5rem;
            font-family: "Inter", sans-serif;
        }

        .Stubadges {
            display: flex;
            gap: 0.75rem;
            align-items: center;
        }

        .select-badge-style {
            padding: 4px 12px;
            border-radius: 9999px !important;
            font-size: 13px;
            font-weight: 500;
            border: 1px solid #a5b4fc;
            cursor: pointer;
            background-color: #eef2ff;
            color: #6366f1;
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            padding-right: 2em;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%236366f1' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 0.5em center;
            background-size: 1em;
            line-height: 1.5;
            font-family: "Inter", sans-serif;
            margin: 0 !important;
        }

            .select-badge-style:focus {
                outline: none;
                border-color: #6366f1;
                box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
            }

        .badgeDiv {
            padding: 4px 12px;
            border-radius: 9999px !important;
            font-size: 13px;
            font-weight: 500;
            display: inline-flex;
            align-items: center;
            gap: 6px;
            font-family: "Inter", sans-serif;
        }

        .badge-danger {
            background-color: #fee2e2;
            color: #ef4444;
        }

        .badge-success {
            background-color: #d1fae5 !important;
            color: #10b981;
        }

        .badge-warn {
            background-color: #fef3c7;
            color: #f59e0b;
        }

        .LastQuiz {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            margin-bottom: 12px;
            font-size: 15px;
            color: #4b5563;
            gap: 5px;
        }

        /* .content-pd {
            padding: 0.8rem 2rem !important;
        } */

        .statsSection {
            margin-bottom: 1.5rem;
        }

        .statsGrid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 2rem;
        }

        .statCard {
            background-color: white;
            border-radius: 1rem !important;
            padding: 2rem;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            position: relative;
            transition: all 0.3s ease;
            display: flex;
            flex-direction: column;
            border: 1px solid #f3f4f6;
            overflow: hidden;
        }

        .statHeader {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            margin-bottom: 0.75rem;
        }

        .statIcon {
            width: 42px;
            height: 42px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 0.5rem !important;
        }

        .statIcon1 {
            background-color: #eef2ff;
            color: #6366f1;
        }

        .statIcon2 {
            background-color: #fef3c7;
            color: #f59e0b;
        }

        .statIcon3 {
            background-color: #fee2e2;
            color: #ef4444;
        }

        .statIcon4 {
            background-color: #d1fae5;
            color: #10b981;
        }

        .statValue {
            font-size: 28px;
            font-weight: 700;
            color: #111827;
            margin-bottom: 0.5rem;
            letter-spacing: -0.025em;
            font-family: "Inter", sans-serif;
        }

        .statLabel {
            font-size: 15px;
            color: #6b7280;
            display: flex;
            align-items: center;
            font-family: "Inter", sans-serif;
        }

        .statProg {
            height: 3.5px;
            background-color: #e5e5e5;
            border-radius: 3px !important;
            margin-top: auto;
        }

        .prog1 {
            height: 100%;
            border-radius: 3px;
            background-color: #6366f1;
        }

        .prog2 {
            height: 100%;
            border-radius: 3px;
            background-color: #f59e0b;
        }

        .prog3 {
            height: 100%;
            border-radius: 3px;
            background-color: #ef4444;
        }

        .prog4 {
            height: 100%;
            border-radius: 3px;
            background-color: #10b981;
        }

        .tabsContainer {
            background-color: white;
            border-radius: 1.5rem !important;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            overflow: hidden;
            margin-bottom: 2rem;
            border: 1px solid #f3f4f6;
        }

        .ntNew {
            border-bottom: 1px solid #e5e7eb;
            background-color: #f9fafb;
            border-top: none !important;
        }

        .nav-tabs > li.active > a:hover {
            text-decoration: none;
        }

        .newTabs {
            padding: 0.5rem 1rem;
            cursor: pointer;
            font-weight: 500;
            color: #4b5563;
            position: relative;
            transition: all 0.2s;
            font-size: 16px;
            font-family: "Inter", sans-serif;
        }

            .newTabs a {
                display: flex !important;
                align-items: center;
                gap: 0.8rem;
            }

            .newTabs.active {
                color: #6366f1;
                background-color: white;
                border-bottom: 2px solid #6366f1;
            }

        .nav-tabs > li.active > a {
            color: #6366f1 !important;
            cursor: default;
            background-color: #fff;
            border: 1px solid #dddddd00 !important;
            border-bottom-color: transparent;
            font-weight: 500 !important;
        }

        .nav-tabs > li > a {
            color: #4b5563 !important;
        }

        .nav-tabs li:after {
            display: none;
        }

        .newTabContent {
            padding: 1.5rem;
            min-height: 600px;
        }

        #piechart_div, #p_analysis_div {
            background-color: white;
            border-radius: 1.5rem !important;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            padding: 1.5rem;
            border: 1px solid #f3f4f6;
            transition: all 0.3s ease;
        }

        .collapse.in {
            display: flex;
            gap: 2rem;
        }

        .card_new {
            box-shadow: none;
        }

        .categoryTable {
            width: 100%;
        }

            .categoryTable th {
                font-weight: 600;
                color: #374151;
                background-color: #f9fafb;
                font-size: 16px;
                font-family: "Inter", sans-serif;
                padding: 16px 24px;
                text-align: center;
                vertical-align: middle;
            }

            .categoryTable td {
                font-size: 16px;
                font-family: "Inter", sans-serif;
                padding: 16px 24px;
                text-align: center;
                vertical-align: middle;
            }

        .noComm {
            padding: 10rem 3rem;
            background-color: #f9fafb;
            border-radius: 1rem;
            text-align: center;
            color: #6b7280;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1.5rem;
            font-size: 16px;
            font-family: "Inter", sans-serif;
        }

        .comFormdiv {
            border: 1px solid #d1d5db;
            padding: 1rem;
            border-radius: 1rem !important;
            text-align: end;
        }

            .comFormdiv textarea {
                border: none;
                box-shadow: none;
                resize: none;
                margin-bottom: 10px !important;
            }

                .comFormdiv textarea:focus {
                    box-shadow: none;
                }

        .card_new .card_header_new {
            height: auto;
            padding: 5px 15px;
            border-bottom: none;
        }

            .card_new .card_header_new h4 {
                display: flex;
                align-items: center;
                gap: 5px;
                font-weight: 600;
                letter-spacing: 0.03em;
            }

        .stickyque ul#nav-tabs-wrapper {
            height: auto !important;
            box-shadow: none !important;
            background-color: transparent;
            border: none;
            padding: 0;
        }

        .QuestDiv {
            padding: 1.5rem !important;
            background-color: white;
            border: 1px solid #e5e7eb !important;
            border-radius: 1rem !important;
            cursor: pointer;
            transition: all 0.2s;
            box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
            position: relative;
            overflow: hidden;
            margin-bottom: 12px !important;
        }

        .stickyque .nav-pillss > li.active > a, .stickyque .nav-pillss > li.active > a:hover, .stickyque .nav-pillss > li.active > a:focus {
            background-color: white !important;
            border: 1px solid #a5b4fc !important;
            border-left-width: 4px !important;
            border-left-color: #6366f1 !important;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
        }

        .stickyque .navv > li > a:hover {
            background-color: white !important;
            border: 1px solid #c5c5c5 !important;
            border-left-width: 4px !important;
            border-left-color: #c5c5c5 !important;
        }

        .questCircle {
            width: 18px;
            height: 18px;
            border-radius: 50% !important;
        }

        .questCircle1 {
            background-color: #10b981;
        }

        .questCircle2 {
            background-color: #f59e0b;
        }

        .questCircle3 {
            background-color: #ef4444;
        }

        .questCircle4 {
            background-color: #5bc0de;
        }

        .questCircle5 {
            background-color: #286090;
        }

        .questPart1 {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 15px;
            font-family: "Inter", sans-serif;
            color: #1f2937;
            font-weight: 600;
            margin-bottom: 6px;
        }

        .questPart2 {
            font-size: 13px;
            color: #6b7280;
            font-family: "Inter", sans-serif;
            letter-spacing: normal;
        }

        .qTabs {
            display: flex;
            flex-direction: column;
        }

        .tabsContainer2 {
            padding: 1.25rem;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            border: 1px solid #e5e7eb;
            border-radius: 1rem !important;
            background: #f1f5f9;
        }


        .quesTag {
            font-weight: 600;
            color: #6366f1;
            margin-bottom: 1rem;
            display: inline-flex;
            align-items: center;
            background-color: #eef2ff;
            padding: 0.25rem 0.75rem;
            border-radius: 0.5rem !important;
            font-size: 14px;
            font-family: "Inter", sans-serif;
        }

        .quesText {
            font-family: "Inter", sans-serif;
            font-size: 16px;
            color: #1f2937;
            line-height: 1.6;
            margin-bottom: 2rem;
            font-weight: 500;
            letter-spacing: normal;
        }

        .radioOpts {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }

            .radioOpts li {
                width: calc(50% - 10px);
            }

        .footerquestions {
            margin: 0px !important;
            background: transparent !important;
            padding: 1rem 0 !important;
            border-top: 1px solid #ddd !important;
            border-bottom: 1px solid #dddddd00 !important;
            margin-top: 10px !important;
        }

        .questiontypeineer {
            padding: 0 !important;
            border: 1px solid #e5e7eb !important;
            border-radius: 1rem !important;
            background: #fff;
            box-shadow: 0 2px 8px rgba(15,23,42,0.07);
            margin-bottom: 1.25rem !important;
            overflow: hidden;
        }

        .questiontypeineer .quesTag {
            margin: 1.25rem 1.5rem 0.75rem !important;
        }

        .questiontypeineer .questComp,
        .questiontypeineer .quesText {
            padding: 0 2rem !important;
        }

        .questiontypeineer .right {
            padding: 1rem 1rem 1rem 1.5rem !important;
            background: #f8fafc;
            border-top: 2px solid #e5e7eb;
            /* margin-top: 0.75rem; */
        }

        .questiontypeineer .right::before {
            content: "Response";
            display: none;
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: #94a3b8;
            margin-bottom: 0.75rem;
            font-family: "Inter", sans-serif;
        }

        .questiontypeineer .footerquestions {
            padding: 0.75rem 1.5rem !important;
            margin: 0 !important;
            background: #f5f5f5 !important;
            border-top: 1px solid #e5e7eb !important;
            border-bottom: 1px solid transparent !important;
        }

        .tabquestion {
            box-shadow: none !important;
        }

        .timeTaken, .marksOb {
            font-family: "Inter", sans-serif;
            font-size: 14px;
            color: #4b5563;
        }

        .inutanswer li .radioss {
            padding: 13px 16px;
            border: 1px solid #e5e7eb;
            display: flex;
            border-radius: 1rem !important;
            gap: 5px;
            align-items: center;
            height: 100%;
            width: 100%;
        }

            .inutanswer li .radioss input {
                display: none;
            }

        .customRadio {
            height: 18px;
            width: 18px;
            border: 2px solid #d1d5db;
            border-radius: 50% !important;
            flex-shrink: 0;
            background-color: white !important;
            padding: 0.7%;
        }

        .customRadio2 {
            height: 100%;
            width: 100%;
            border-radius: 50% !important;
            background-color: transparent;
        }

        .optLabel {
            font-size: 16px;
            font-family: "Inter", sans-serif;
            line-height: 1.2;
            color: black;
            font-weight: normal;
            letter-spacing: normal;
        }

        .corrOpt {
            background-color: #d1fae5;
            border: 1px solid #10b981 !important;
        }

        .incorOpt {
            background-color: #fee2e2;
            border: 1px solid red !important;
        }

        .corRad1 {
            border: 2px solid #10b981;
        }

        .incorRad1 {
            border: 2px solid red;
        }

        .corRad1 {
            background-color: #10b981;
        }

        .incorRad1 {
            background-color: red;
        }

        .inutanswer li {
            padding: 0px !important;
            border: none !important;
            margin-bottom: 0px !important;
        }

        .customCheckbox {
            height: 22px;
            width: 22px;
            border: 2px solid #d1d5db;
            flex-shrink: 0;
            background-color: white;
            padding: 0.7%;
        }

            .customCheckbox i {
                color: white;
            }

        .corCheck {
            background-color: #10b981;
            border: 2px solid #10b981;
        }

        .incorCheck {
            background-color: red;
            border: 2px solid red;
        }

        .matrixTable {
            margin-bottom: 0px;
        }

            .matrixTable th {
                font-size: 14px;
                font-family: "Inter", sans-serif;
                font-weight: 500;
                vertical-align: middle !important;
            }

            .matrixTable td {
                font-size: 14px;
                font-family: "Inter", sans-serif;
                font-weight: 500;
                vertical-align: middle !important;
            }

                .matrixTable td input {
                    display: none;
                }

        .portlet > .portlet-title > .caption {
            letter-spacing: normal;
            font-size: 16px;
        }

        .portlet.box > .portlet-title {
            border: none !important;
        }

        .portlet.box {
            box-shadow: none !important;
        }

        .quizcentermain h4 span {
            font-weight: 600 !important;
        }

        .orderingqu {
            display: flex;
            flex-direction: column;
            gap: 5px;
        }

            .orderingqu li span, .orderingqu1 li span {
                height: auto;
                min-height: auto;
                max-height: none;
                font-size: 14px;
            }

        .mp-answer {
            display: flex;
            flex-direction: column;
            gap: 5px;
        }

        .commentDiv {
            border-radius: 1rem !important;
        }

        .stickydiv {
            max-height: 500px;
            overflow: auto;
            scrollbar-width: none; /* Firefox */
            -ms-overflow-style: none; /* IE 10+ */
        }
        .stickDivsurveyResp{
                padding: 0 10px 0 0;
        }

            .stickydiv::-webkit-scrollbar {
                display: none;
            }

        .tabsContainer2 {
            max-height: 500px;
            overflow: scroll;
            scrollbar-width: none; /* Firefox */
            -ms-overflow-style: none; /* IE 10+ */
        }

            .tabsContainer2::-webkit-scrollbar {
                display: none;
            }

        .questiontypeineer h4 {
            anchor-name: none;
            font-size: 18px !important;
            margin: 0px !important;
            background: none !important;
            padding: 10px 5px !important;
            font-weight: 600 !important;
            letter-spacing: normal !important;
            display: flex !important;
            align-items: center !important;
            border-bottom: none !important;
        }

        .questComp {
            font-size: 16px;
            margin: 10px 0px;
        }

        .pendingeval {
            color: #4a4a4b;
            text-decoration: none;
            cursor: pointer;
        }

        .evalHeader {
            font-size: 15px;
            font-family: "Inter", sans-serif;
            margin: 5px 0px;
            color: #6b6b6b;
            font-weight: 500;
            letter-spacing: normal;
        }

        textarea.resize-v {
            letter-spacing: normal;
            font-size: 15px;
        }

        .evalBtns {
            margin: 10px 0px;
            display: block;
        }

        .tabs-container {
            position: sticky;
            top: 0;
            background: #fff;
            z-index: 2;
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
        }

        .tabsUl {
            display: flex;
            border-bottom: 1px solid #e0e0e0;
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .tabBtn {
            flex: 1;
            text-align: center;
            padding: 1em 0;
            cursor: pointer;
            color: #555;
            transition: background 0.2s, color 0.2s;
            border: none;
            background: none;
            outline: none;
        }

            .tabBtn.active, .tabBtn.active:hover {
                color: #6366f1;
                border-bottom: 2px solid #6366f1;
                background: white;
            }

            .tabBtn:hover {
                color: #555;
                background: #eee;
            }

        .sections-outer {
            height: 75vh;
            overflow-y: scroll; /* still scrollable */
            overflow-x: hidden;
            position: relative;
            background: #fff;
            scrollbar-width: none; /* Firefox */
            -ms-overflow-style: none; /* IE 10+ */
        }

            .sections-outer::-webkit-scrollbar {
                display: none;
            }



        .section {
            height: auto;
            padding: 3rem 1.5rem;
            box-sizing: border-box;
            border-bottom: 1px solid #e0e0e0;
            /*            font-size: 2em;*/
            transition: background 0.2s;
            color: #333;
            min-height: 75vh;
            /*            margin:20px 0px !important;*/
            /*            background-color:lightblue;*/
            overflow: hidden;
        }
        /*        #sec4{
                    height:50vh !important;
                }*/
        .scrollMain {
            border-radius: 20px !important;
            box-shadow: 0 1px 0.2rem 0 rgba(0, 0, 0, 0.1);
            overflow: hidden;
        }

        .newTabs2 {
            padding: 0rem 0rem;
            cursor: pointer;
            font-weight: 500;
            color: #4b5563;
            position: relative;
            transition: all 0.2s;
            font-size: 16px !important;
            font-family: "Inter", sans-serif;
        }

            .newTabs2 a {
                display: flex !important;
                align-items: center;
                gap: 0.8rem;
                height: 100%;
                padding: 1.5rem;
                text-decoration: none;
            }

        #chartcollapseExample {
            padding: 0px 0px;
        }

        #sec2 {
            min-height: 40vh;
        }

        #sec1 {
            min-height: 50vh;
        }

        .mobileSelectDiv {
            display: none;
        }

        .stickyque {
            width: 100%;
        }

            .stickyque ul#nav-tabs-wrapper {
                width: 100%;
            }

        .StatusFlex {
            display: flex;
            justify-content: end;
            gap: 10px;
        }

        .StatusCheck {
            display: flex;
            align-items: center;
            gap: 3px;
            font-size: 15px;
        }

            .StatusCheck input {
                margin: 0px;
                box-shadow: none;
            }

        span.badgenumbers.ng-binding {
            width: 20px !important;
            height: 20px !important;
            border-radius: 100%;
            font-size: 13px !important;
            display: flex !important;
            text-align: center;
            color: #fff;
            /* font-weight: 600; */
            /* padding: 3px 8px; */
            justify-content: center;
            align-items: center;
        }

        .questiontypeineer img {
            height: 36px;
            object-fit: contain;
        }

        .inutanswer li {
            justify-content: center;
        }

        ul.list-unstyled.orderingqu img {
            height: 36px;
            width: auto;
            background: transparent;
            object-fit: contain;
        }

        @media (max-width:767px) {
            .statsGrid {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
                gap: 2rem;
            }

            .infoCard {
                flex-direction: column;
            }

            .stuFlexDiv {
                flex-direction: column;
                align-items: center;
                text-align: center;
            }

            .LastQuiz {
                display: flex;
                align-items: center;
                justify-content: center;
                margin-bottom: 2px;
                font-size: 13px;
                color: #4b5563;
                gap: 5px;
            }

            .studentName {
                margin: 5px 0px;
            }

            .NOA {
                margin-bottom: 10px;
            }

            .Stubadges {
                justify-content: center;
            }

            .lastQuizDiv {
                width: 100%;
                margin-top: 10px;
            }

            .collapse.in {
                overflow: auto;
                flex-direction: column;
            }

            div:has(> #performance) {
                overflow: auto;
            }

            .ntNew {
                display: flex;
                flex-direction: column;
                align-items: center;
                padding: 10px 0;
                /*overflow-x: auto;
                overflow-y: hidden;*/
            }

            .newTabs a {
                display: flex !important;
                align-items: center;
                gap: 0.8rem;
                justify-content: center;
                width: max-content;
                border: 1.5px solid #6366f1 !important;
                border-radius: 33px !important;
                font-size: 13px !important;
            }

            .radioOpts li {
                width: 100%;
            }

            .radioOpts {
                flex-direction: column;
            }

            .mobileSelectDiv {
                display: flex;
                justify-content: center;
                margin-bottom: 10px;
            }

            .mobileSelect {
                padding: 7px 30px;
                font-size: 16px;
            }

            .nav-tabs > li.active > a {
                color: #ffffff !important;
                background: #6366f1 !important;
            }

            .newTabs {
                padding: 0.5rem;
            }

            .main_top_headers {
                flex-wrap: nowrap;
                align-items: baseline;
                gap: 30px;
            }

                .main_top_headers h1 {
                    font-size: 19px;
                }

            .pageSubHeader {
                font-size: 12px;
                line-height: 1.1;
                margin-bottom: 10px;
            }

            .main_top_headers a.btn {
                margin-top: 0px;
                font-size: 13px;
            }

            .newTabs.active {
                border-bottom: 2px solid #6366f100;
            }

            .page-content-wrapper {
                padding: 1rem 2rem;
            }

            #chart_div, #piechart {
                padding: 0 !important;
            }

            .questiontypeineer {
                border: 1px solid #e5e7eb !important;
                padding: 0 !important;
                border-radius: 1rem !important;
            }

            .page-sidebar-wrapper {
                width: 100%;
                display: none;
            }

            .page-content-wrapper {
                padding: 1rem 0;
            }

            #sec2 {
                overflow-x: auto;
            }

            .StatusFlex {
                display: flex;
                justify-content: center;
                gap: 10px;
                flex-wrap: wrap;
            }
        }

        @media (min-width: 768px) and (max-width: 1024px) {
            .page-content-wrapper {
                width: 100vw;
            }

            .statsGrid {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 2rem;
            }

            .page-sidebar-wrapper {
                width: 0%;
            }

            .page-sidebar.navbar-collapse.in {
                width: 95vw;
            }

            #piechart_div, #p_analysis_div {
                width: 100%;
            }

            #chartcollapseExample {
                padding: 0px 0px;
                flex-direction: column;
            }

            .stickydiv {
                display: none;
            }

            .bs-sm:w-9/12 {
                width: 100% !important;
            }

            .mobileSelectDiv {
                display: block;
                padding: 10px;
                text-align: center;
            }
        }

/* text-transform overrides (applied by inner style block on PlanPreAssessmentEvaluationsPage) */
.studentAvatar { text-transform: uppercase; }
.studentName { text-transform: capitalize; }

/* hotspot question type */
.hotspotCreator-arrange { width: 100% !important; }

/* matrix / multiheader table */
.overflow-x-auto .table.multiheader tbody tr td:first-child {
                        color: #000000;
                        font-size: 1.5rem;
                        font-weight: 400;
                        /* background: #3F51B5; */
                        /* border: 0 !important; */
                    }

                    .overflow-x-auto .table.multiheader thead tr:nth-child(2) th:not(:first-child) {
                        background: #d8d7d7 !important;
                        color: #2e2d2d !important;
                        font-weight: 600 !important;
                        font-size: 1.6rem !important;
                        line-height: 1.2rem;
                    }

                    .overflow-x-auto .table.multiheader thead tr:nth-child(1) th:not(:first-child) {
                        background: #3F51B5 !important;
                        color: #fff !important;
                        border-bottom: 1px solid #eee;
                        font-size: 1.9rem;
                        height: 40px;
                    }

                    .overflow-x-auto .table.multiheader tbody tr td h4 {
                        font-size: 1.5rem;
                        font-weight: 400;
                    }

                    .overflow-x-auto .table.multiheader thead tr:nth-child(1) th:first-child {
                        background: #ffffff !important;
                        border-right: 1px solid #fff !important;
                        width: 15%;
                    }

                    .overflow-x-auto .table.multiheader thead tr:nth-child(2) th:first-child {
                        font-size: 1.9rem;
                        background: #3F51B5 !important;
                        /* writing-mode: vertical-lr; */
                        /* transform: scale(-1, -1); */
                    }

                    div#Responseeses .overflow-x-auto .table.multiheader thead tr:nth-child(1) th:first-child {
                        font-size: 1.7rem;
                        color: #fff !important;
                    }

                    .overflow-x-auto .table {
                        box-shadow: 0 0 0 rgba(0, 0, 0, 0.25);
                        /* border-radius: 1.2rem !important; */
                        background: #fff;
                        overflow: auto;
                    }

/* ═══════════════════════════════════════════════════════════════════════════
   AI Quiz Wizard — CreateFinalCourseQuizWithAI
   ═══════════════════════════════════════════════════════════════════════════ */
.ai-wizard__stepper{display:flex;align-items:flex-start;background:#fff;border-radius:12px;border:1px solid #e2e8f0;box-shadow:0 2px 12px rgba(0,0,0,.07);padding:20px 24px;margin-bottom:24px}
.ai-wizard__step-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}
.ai-wizard__connector{flex:1;height:2px;background:#e2e8f0;margin-top:20px;transition:background .3s}
.ai-wizard__connector--active{background:#6366f1}
.ai-wizard__step-circle{width:40px;height:40px;min-width:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;border:2px solid #e2e8f0;background:#f8fafc;color:#94a3b8;transition:all .25s}
.ai-wizard__step-item--active .ai-wizard__step-circle{background:#6366f1;border-color:#6366f1;color:#fff;box-shadow:0 0 0 4px rgba(99,102,241,.15)}
.ai-wizard__step-item--done .ai-wizard__step-circle{background:#059669;border-color:#059669;color:#fff}
.ai-wizard__step-label{font-size:11px;font-weight:600;color:#94a3b8;text-align:center;line-height:1.3;letter-spacing:.02em}
.ai-wizard__step-item--active .ai-wizard__step-label{color:#6366f1}
.ai-wizard__step-item--done .ai-wizard__step-label{color:#059669}
.ai-wizard__panel{background:#fff;border-radius:12px;border:1px solid #e2e8f0;box-shadow:0 2px 12px rgba(0,0,0,.07);overflow:hidden;margin-bottom:24px}
.ai-wizard__panel-header{padding:16px 24px;border-bottom:1px solid #f1f5f9;background:#fafbff;display:flex;align-items:center;gap:10px}
.ai-wizard__panel-title{font-size:15px;font-weight:700;color:#1e293b;margin:0;display:flex;align-items:center;gap:8px}
.ai-wizard__panel-title i{color:#6366f1;font-size:14px}
.ai-wizard__panel-body{padding:24px}
.ai-wizard__actions{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-top:1px solid #f1f5f9;background:#f8fafc;gap:12px;flex-wrap:wrap}
.ai-wizard__actions--end{justify-content:flex-end}
.ai-topic-lesson{border:1px solid #e2e8f0;border-radius:10px;overflow:hidden;background:#fff;margin-bottom:12px}
.ai-topic-lesson__header{padding:12px 18px;background:#f1f5f9;font-size:13px;font-weight:700;color:#1e293b;display:flex;align-items:center;gap:8px}
.ai-topic-lesson__header i{color:#6366f1;font-size:13px}
.ai-topic-item{padding:14px 18px;border-top:1px solid #f1f5f9}
.ai-topic-item__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ai-topic-item__top>input[type=checkbox]{width:16px;height:16px;flex-shrink:0;accent-color:#6366f1;cursor:pointer}
.ai-topic-item__name{font-size:13px;font-weight:600;color:#374151;flex:1;line-height:1.4}
.ai-topic-item__unavail{font-size:11px;color:#dc2626;display:inline-flex;align-items:center;gap:4px;font-weight:500}
.ai-topic-item__config{display:grid;grid-template-columns:140px 160px 1fr;gap:16px;margin-top:14px;padding:14px;background:#f8fafc;border-radius:8px;border:1px solid #f1f5f9}
@media(max-width:768px){.ai-topic-item__config{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.ai-topic-item__config{grid-template-columns:1fr}}
.ai-topic-item__config-label{font-size:10px;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;display:block}
.ai-topic-item__qtypes{display:flex;flex-wrap:wrap;gap:8px;padding-top:2px}
.ai-topic-item__qtypes label{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:500;color:#374151;cursor:pointer;padding:4px 10px;border-radius:6px;border:1px solid #e2e8f0;background:#fff;transition:all .15s;user-select:none;margin:0}
.ai-topic-item__qtypes label:has(input:checked){background:#eef2ff;border-color:#6366f1;color:#4f46e5;font-weight:600}
.ai-topic-item__qtypes input[type=checkbox]{width:13px;height:13px;accent-color:#6366f1;flex-shrink:0}
.ai-cat-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;background:#eef2ff;border:1px solid #c7d2fe;border-radius:10px;padding:16px 20px;margin-bottom:20px}
.ai-cat-row__label{font-size:13px;font-weight:700;color:#3730a3;display:flex;align-items:center;gap:6px;flex-shrink:0}
.ai-cat-row__label i{color:#6366f1}
.ai-cat-row__dropdown{flex:1;min-width:180px}
.ai-cat-row__btn{flex-shrink:0}
.ai-qgroup{margin-bottom:24px}
.ai-qgroup__title{font-size:13px;font-weight:700;color:#1e293b;margin-bottom:12px;display:flex;align-items:center;gap:8px;padding-bottom:10px;border-bottom:2px solid #eef2ff}
.ai-qgroup__title i{color:#6366f1}
.ai-qcard{border:1.5px solid #e2e8f0;border-radius:10px;overflow:hidden;margin-bottom:10px;background:#fff;transition:border-color .15s,box-shadow .15s}
.ai-qcard__header{padding:14px 16px;display:flex;align-items:flex-start;gap:12px}
.ai-qcard__check{margin-top:3px;flex-shrink:0;accent-color:#6366f1;width:16px;height:16px;cursor:pointer}
.ai-qcard__question{font-size:13px;font-weight:600;color:#1e293b;flex:1;line-height:1.1}
.ai-qcard__answers{padding:0 16px 14px 44px;border-top:1px solid #f1f5f9;background:#fafbff}
.ai-qcard__answers .list-unstyled{display:flex;flex-direction:column;gap:6px;margin:10px 0 0;padding:0;list-style:none}
.ai-qcard__answers .list-unstyled li{display:flex;align-items:center;gap:8px;font-size:12px;color:#64748b}
.checkboxquizque input[type="checkbox"], .checkboxquizque input[type="radio"]{
    margin:0;
    background:white;
    height: 1rem;
    width: 1rem;
    -webkit-appearance: none;
}
.unstyledListnew li{
    align-items: center !important;
}
.unstyledListnew li input{
    margin: 0 !important;
}
.ai-qcard__answers .list-unstyled li label{margin:0;cursor:default;line-height:1.4;font-weight:500}
.ai-qcard__answers .list-unstyled li label.text-success{color:#059669!important;font-weight:700}
.ai-qcard__textarea{width:100%;border:1px solid #e2e8f0;border-radius:8px;padding:10px 12px;font-size:12px;color:#64748b;resize:vertical;background:#f8fafc;margin-top:10px;min-height:100px}
.ai-qcard__table{width:100%;border-collapse:collapse;font-size:12px;margin-top:10px}
.ai-qcard__table th,.ai-qcard__table td{border:1px solid #e2e8f0;padding:8px 12px;text-align:left}
.ai-qcard__table th{background:#f1f5f9;font-weight:700;color:#475569}
.ai-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;gap:12px;text-align:center}
.ai-empty-state i{font-size:32px;color:#c7d2fe}
.ai-empty-state h3{font-size:16px;font-weight:700;color:#1e293b;margin:0}
.ai-empty-state p{font-size:13px;color:#64748b;margin:0}
.mv-form-3col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
@media(max-width:768px){.mv-form-3col{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.mv-form-3col{grid-template-columns:1fr}}
.mv-form-row--compact{margin-bottom:0}
.mv-form-label__hint{font-size:11px;color:#64748b;font-weight:400;margin-left:4px}
.required-star{font-size:8px;color:#dc2626;vertical-align:super}
/* ── end Pre-Assessment Evaluations ─────────────────────────────────────────── */
/* ── ExternalCurriculumWidget ───────────────────────────────────────────────── */
.ecw-page{font-family:'Open Sans',sans-serif;background:#f0f4f8;color:#1e293b;min-height:100vh}
.ecw-hero{background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%);padding:52px 24px 60px;text-align:center;position:relative;overflow:hidden}
.ecw-hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 20% 50%,rgba(255,255,255,.06) 0%,transparent 60%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.08) 0%,transparent 50%)}
.ecw-hero__inner{position:relative;max-width:680px;margin:0 auto}
.ecw-hero__badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.15);color:#fff;font-size:11px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;padding:5px 14px;border-radius:100px;margin-bottom:18px}
.ecw-hero__title{color:#fff;font-size:34px;font-weight:800;line-height:1.2;margin-bottom:12px}
.ecw-hero__sub{color:rgba(255,255,255,.78);font-size:15px;font-weight:400}
.ecw-filter-wrap{max-width:1280px;margin:-30px auto 0;padding:0 24px;position:relative;z-index:10}
.ecw-filter{background:#fff;border-radius:16px;box-shadow:0 12px 48px rgba(15,23,42,.13);padding:24px 28px}
.ecw-filter__grid{display:grid;grid-template-columns:auto 1fr 1fr 1fr 1fr 1fr auto;gap:16px;align-items:end}
.ecw-filter__label{display:block;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#64748b;margin-bottom:6px}
.ecw-filter__input,.ecw-filter__select{width:100%;height:40px;padding:0 12px;border:1.5px solid #e2e8f0;border-radius:8px;font-size:13px;font-family:'Open Sans',sans-serif;color:#1e293b;background:#fff;transition:border-color .15s,box-shadow .15s;outline:none}
.ecw-filter__select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath fill='%2364748b' d='M5 7L0 2h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
.ecw-filter__input:focus,.ecw-filter__select:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.12)}
.ecw-view-toggle{display:flex;background:#f1f5f9;border-radius:8px;padding:3px;gap:3px}
.ecw-view-toggle__btn{display:flex;align-items:center;justify-content:center;width:37px;height:34px;border-radius:6px;border:none;background:transparent;color:#94a3b8;font-size:14px;cursor:pointer;transition:all .15s}
.ecw-view-toggle__btn.ecw-active,.ecw-view-toggle__btn:hover{background:#fff;color:#6366f1;box-shadow:0 1px 5px rgba(0,0,0,.1)}
.ecw-btn{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 18px;border-radius:8px;font-size:13px;font-weight:600;font-family:'Open Sans',sans-serif;cursor:pointer;border:none;transition:all .15s;white-space:nowrap}
.ecw-btn--search{background:#6366f1;color:#fff}
.ecw-btn--search:hover{background:#4f46e5}
.ecw-btn--reset{background:#f1f5f9;color:#64748b}
.ecw-btn--reset:hover{background:#e2e8f0;color:#475569}
.ecw-filter__actions{display:flex;gap:8px}
.ecw-catalog-wrap{max-width:1280px;margin:32px auto 48px;padding:0 24px}
.ecw-catalog-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.ecw-catalog-count{font-size:13px;color:#64748b;font-weight:500}
.ecw-catalog-count strong{color:#1e293b;font-weight:700}
.ecw-catalog{display:grid;gap:24px}
.ecw-catalog--grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.ecw-catalog--list{grid-template-columns:1fr;gap:16px}
.ecw-catalog--grid .ecw-item{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 14px rgba(15,23,42,.07);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.ecw-catalog--grid .ecw-item:hover{transform:translateY(-4px);box-shadow:0 14px 40px rgba(15,23,42,.13)}
.ecw-catalog--grid .ecw-item__thumb{position:relative;width:100%;padding-top:56.25%;overflow:hidden;background:#e2e8f0;flex-shrink:0}
.ecw-catalog--grid .ecw-item__thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.ecw-catalog--grid .ecw-item:hover .ecw-item__thumb img{transform:scale(1.05)}
.ecw-catalog--grid .ecw-item__body{padding:18px;flex:1;display:flex;flex-direction:column;gap:8px}
.ecw-catalog--grid .ecw-item__footer{padding:14px 18px;border-top:1px solid #f1f5f9;display:flex;align-items:center;justify-content:space-between;gap:10px}
.ecw-catalog--list .ecw-item{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 14px rgba(15,23,42,.07);display:flex;transition:box-shadow .2s}
.ecw-catalog--list .ecw-item:hover{box-shadow:0 8px 32px rgba(15,23,42,.11)}
.ecw-catalog--list .ecw-item__accent{width:5px;background:#6366f1;flex-shrink:0}
.ecw-catalog--list .ecw-item__thumb{width:190px;flex-shrink:0;position:relative;overflow:hidden}
.ecw-catalog--list .ecw-item__thumb img{width:100%;height:100%;min-height:130px;object-fit:cover;display:block;transition:transform .3s}
.ecw-catalog--list .ecw-item:hover .ecw-item__thumb img{transform:scale(1.03)}
.ecw-catalog--list .ecw-item__body{flex:1;padding:20px 24px;display:flex;flex-direction:column;gap:8px;justify-content:center}
.ecw-catalog--list .ecw-item__footer{padding:20px 24px;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:12px;border-left:1px solid #f1f5f9;flex-shrink:0}
.ecw-item__accent{display:none}
.ecw-catalog--list .ecw-item__accent{display:block}
.ecw-item__cat{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:#6366f1}
.ecw-item__title{font-size:15px;font-weight:700;color:#1e293b;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ecw-catalog--list .ecw-item__title{font-size:16px;-webkit-line-clamp:1}
.ecw-item__desc{font-size:13px;color:#64748b;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.ecw-catalog--list .ecw-item__desc{-webkit-line-clamp:2}
.ecw-item__price-pill{position:absolute;top:12px;right:12px;background:#6366f1;color:#fff;font-size:12px;font-weight:700;padding:3px 11px;border-radius:100px}
.ecw-item__price-pill--free{background:#16a34a}
.ecw-catalog--list .ecw-item__price-pill{display:none}
.ecw-item__price{font-size:16px;font-weight:800;color:#1e293b}
.ecw-item__price--free{color:#16a34a}
.ecw-item__price small{font-size:11px;color:#94a3b8;font-weight:400}
.ecw-catalog--list .ecw-item__price{font-size:18px;text-align:right}
.ecw-enroll-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 18px;border-radius:8px;background:#6366f1;color:#fff;font-size:13px;font-weight:600;text-decoration:none;transition:background .15s,transform .1s;min-height:36px;white-space:nowrap}
.ecw-enroll-btn:hover{background:#4f46e5;color:#fff;text-decoration:none;transform:translateY(-1px)}
.ecw-enroll-btn:focus{outline:none;box-shadow:0 0 0 3px rgba(99,102,241,.3)}
.ecw-empty{text-align:center;padding:72px 24px;background:#fff;border-radius:14px;box-shadow:0 2px 14px rgba(15,23,42,.07)}
.ecw-empty__icon{width:68px;height:68px;border-radius:50%;background:#eef2ff;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-size:26px;color:#6366f1}
.ecw-empty__title{font-size:17px;font-weight:700;color:#1e293b;margin-bottom:8px}
.ecw-empty__sub{font-size:14px;color:#94a3b8}
.ecw-pagination{display:flex;justify-content:center;margin-top:36px}
.ecw-pagination .pagination{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}
.ecw-pagination .pagination>li>a,.ecw-pagination .pagination>li>span{border-radius:8px;margin:0;border:1.5px solid #e2e8f0;color:#64748b;font-weight:600;font-size:13px;padding:7px 14px;min-width:38px;line-height:1.4;transition:all .13s}
.ecw-pagination .pagination>.active>a,.ecw-pagination .pagination>.active>span{background:#6366f1!important;border-color:#6366f1!important;color:#fff!important}
.ecw-pagination .pagination>li>a:hover{background:#eef2ff;border-color:#6366f1;color:#6366f1}
.ecw-pagination .pagination>.disabled>a,.ecw-pagination .pagination>.disabled>span{opacity:.4;pointer-events:none}
@media(max-width:1024px){.ecw-filter__grid{grid-template-columns:auto 1fr 1fr 1fr}.ecw-filter__col-name{grid-column:1/3}.ecw-filter__actions{grid-column:3/5;justify-content:flex-end}}
@media(max-width:768px){.ecw-hero{padding:36px 16px 48px}.ecw-hero__title{font-size:24px}.ecw-filter__grid{grid-template-columns:1fr 1fr}.ecw-filter__toggle{grid-column:1/-1}.ecw-filter__col-name{grid-column:1/-1}.ecw-filter__actions{grid-column:1/-1}.ecw-btn{flex:1;justify-content:center}.ecw-catalog--list .ecw-item{flex-direction:column}.ecw-catalog--list .ecw-item__accent{width:100%;height:4px}.ecw-catalog--list .ecw-item__thumb{width:100%;height:180px}.ecw-catalog--list .ecw-item__footer{border-left:none;border-top:1px solid #f1f5f9;flex-direction:row;align-items:center;justify-content:space-between;padding:14px 16px}}
@media(max-width:640px){.ecw-filter-wrap{padding:0 12px}.ecw-filter{padding:18px 16px}.ecw-filter__grid{grid-template-columns:1fr;gap:12px}.ecw-catalog-wrap{padding:0 12px}.ecw-catalog--grid{grid-template-columns:1fr;gap:16px}}
/* ── end ExternalCurriculumWidget ───────────────────────────────────────────── */

/* ── SurveyResponseDetails ──────────────────────────────────────────────────── */
.srd-student-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.05);
    flex-wrap: wrap;
}

.srd-student-card__identity {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
    min-width: 0;
}

.srd-student-card__avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #eef2ff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6366f1;
    font-size: 22px;
    flex-shrink: 0;
}

.srd-student-card__name {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 2px;
}

.srd-student-card__email {
    font-size: 13px;
    color: #64748b;
    margin: 0;
}

.srd-no-records {
    text-align: center;
    padding: 60px 24px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    color: #94a3b8;
}

.customCtrl {
    font-size: 13px;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    padding: 6px 12px;
    color: #334155;
}

@media (max-width: 768px) {
    .srd-student-card {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* ── end SurveyResponseDetails ──────────────────────────────────────────────── */

/* ── CourseWidget (iframe embed) ─────────────────────────────────────────────── */
.cw-page {
    margin: 0;
    padding: 14px;
    font-family: 'Open Sans', sans-serif;
    background: #f1f5f9;
    min-height: 100vh;
    box-sizing: border-box;
}

.cw-card {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 4px 28px rgba(15, 23, 42, 0.13);
    overflow: hidden;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

.cw-thumb {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    background: #e2e8f0;
    overflow: hidden;
}
.cw-thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cw-stats {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    background: linear-gradient(to top, rgba(15,23,42,0.72) 0%, transparent 100%);
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 28px 14px 10px;
}
.cw-stats span,
.cw-stats a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
}
.cw-stats a:hover { opacity: 0.85; }

.cw-type-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(99, 102, 241, 0.9);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 11px;
    border-radius: 20px;
}

.cw-body {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cw-author {
    display: flex;
    align-items: center;
    gap: 10px;
}
.cw-author-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #e0e7ff;
    flex-shrink: 0;
}
.cw-author-label {
    font-size: 10px;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
    line-height: 1.2;
}
.cw-author-name {
    font-size: 13px;
    font-weight: 600;
    color: #334155;
    line-height: 1.3;
}

.cw-title {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.45;
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.cw-desc {
    font-size: 13px;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.cw-desc * { font-size: 13px !important; color: #64748b !important; margin: 0 !important; }

.cw-divider {
    border: none;
    border-top: 1px solid #f1f5f9;
    margin: 2px 0;
}

.cw-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.cw-price {
    font-size: 20px;
    font-weight: 800;
    color: #0f172a;
    line-height: 1;
}
.cw-price--free { color: #16a34a; }

.cw-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #6366f1;
    color: #fff !important;
    text-decoration: none !important;
    border-radius: 8px;
    padding: 10px 18px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    transition: background 0.15s ease;
    white-space: nowrap;
    min-height: 40px;
}

/* ── Training Program Details hero header (scoped to .tpd-page so it never
     leaks onto other pages that reuse the same legacy class names) ────────── */
.tpd-page .topviewdetails.tpd-hero {
    background: #fff;
    border: none;
    border-top: 3px solid #6366f1;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .05), 0 4px 16px rgba(99, 102, 241, .07);
    padding: 10px 20px 20px 20px;
    margin-bottom: 20px;
    display: block;
}
.tpd-page #tp_header.flex.flex-wrap { align-items: flex-start; gap: 24px 28px; }
.tpd-page .tpd-hero__media {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: stretch;
    flex: none;
    background: none;
 }

/* thumbnail — matches .ce-hero__thumb (LCMS/CourseEditor). Uses only tpd-* classes
   (not the legacy .viewdetailslogo/.overlay names) so the old fixed-size,
   object-fit:contain!important rules in curriculum_editor.css can't leak in. */
.tpd-page .tpd-hero__thumb {
    position: relative;
    width: 100%;
    height: 210px;
    border-radius: 12px;
    overflow: hidden;
    background: #f1f5f9;
    box-shadow: 0 1px 4px rgba(15, 23, 42, .08), 0 4px 16px rgba(15, 23, 42, .06);
}
.tpd-page .tpd-hero__thumb .editedimgcourse { width: 100%; height: 100%; object-fit: contain; display: block; }
.tpd-page .tpd-hero__thumb-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(15, 23, 42, .78) 0%, transparent 100%);
    padding: 12px 10px 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    opacity: 0;
    transition: opacity .2s ease;
}
.tpd-page .tpd-hero__thumb:hover .tpd-hero__thumb-overlay { opacity: 1; }
.tpd-page .tpd-hero__thumb-overlay .ph-btn { width: 100%; justify-content: center; }
.tpd-page .tpd-hero__thumb-edit {
    width: 40px;
    height: 40px;
    min-height: 40px;
    min-width: 40px;
    border-radius: 999px;
    background: #fff;
    color: #6366f1 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
}
.tpd-page .tpd-hero__body { flex: 1 1 320px; min-width: 0; padding-top: 2px; }
.tpd-page .tpd-hero__body .titlecourse.tpd-hero__title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 21px;
    font-weight: 800;
    color: #1e293b;
    margin: 0 0 14px;
    line-height: 1.3;
    word-break: break-word;
}
.tpd-page .tpd-hero__title i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 9px;
    background: #eef2ff;
    color: #6366f1;
    font-size: 15px;
}
.tpd-page .tpd-hero__meta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.tpd-page .tpd-hero__meta .mv-page-header__meta-item { margin: 0; }
.tpd-page .tpd-hero__meta .mv-page-header__meta-item strong i { margin: 0px; color: #94a3b8; font-size: 12px; }
.tpd-hero__meta .mv-page-header__meta-item {
    align-items: baseline;
    gap: 3px;
}
.tpd-hero__meta .mv-page-header__meta-item strong {
    display: flex;
    align-items: baseline;
    gap: 3px;
}
.tpd-page .tpd-hero__desc {
    font-size: 13px;
    color: #64748b;
    line-height: 1.6;
    background: #f8fafc;
    border-left: 3px solid #e2e8f0;
    border-radius: 0 8px 8px 0;
    padding: 12px 14px;
}

/* actions column (batch selector / status / registration) */
.tpd-page .tpd-hero__actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 260px;
    margin-left: 4px;
        padding: 10px 15px;
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 12px;
        margin-bottom: 10px;
}
.tpd-page .tpd-hero__actions-block { display: flex; flex-direction: column; gap: 4px; margin-bottom: 0;}
.tpd-page .tpd-hero__actions-caption {
       font-size: 12px !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #6e6e6e;
    margin: 0;
}
.tpd-page .tpd-hero__actions-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.tpd-page .tpd-hero__actions-row--between { justify-content: space-between; flex-wrap: nowrap; gap: 8px; }
.tpd-page .tpd-hero__batch-name {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 700;
    color: #4f46e5;
    background: #eef2ff;
    border-radius: 8px;
    padding: 6px 12px;
    margin: 0;
    line-height: 1.3;
    gap: 7px;
}
.tpd-page .tpd-hero__batch-name i{
    margin: 2px 0 0 0 !important;
    cursor: pointer;
}
.tpd-page .tpd-hero__thumb-edit--sm {
    width: 28px;
    height: 28px;
    min-height: 28px;
    min-width: 28px;
    border: 1px solid #e2e8f0;
    box-shadow: none;
    flex-shrink: 0;
}
.tpd-page .tpd-hero__batch-btns { gap: 8px; margin-top: 2px; }
.tpd-page .tpd-hero__batch-btns .input-group-btn { flex: 1 1 0; }
.tpd-page .tpd-hero__batch-btns .input-group-btn .ph-btn { width: 100%; justify-content: center; }
.tpd-page .tpd-hero__status-block { flex-direction: column; align-items: stretch; gap: 4px; }
.tpd-page .tpd-hero__status-badge-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 5px 0; }
.tpd-page .tpd-hero__status-badge-row .mc-badge{
    width: 100%;
    justify-content: center;
}
.tpd-page .tpd-hero__status-block > .ph-btn { width: 100%; justify-content: center; }
.tpd-page .tpd-hero__reg-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    font-size: 12px;
    font-weight: 700;
    min-height: 35px;
    border-radius: 8px;
    border: 1px solid transparent;
}
.tpd-page .tpd-hero__reg-link--open { color: #16a34a !important; background: #f0fdf4; border-color: #bbf7d0; }
.tpd-page .tpd-hero__reg-link--closed { color: #dc2626 !important; background: #fef2f2; border-color: #fecaca; }

/* success/error toast (matches .ce-toast in LCMS/CourseEditor course_editor.css,
   which isn't loaded on this page, so it's reproduced here) */
.ce-toast {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 16px;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.14), 0 1px 4px rgba(15, 23, 42, 0.08);
    min-width: 260px;
    max-width: 380px;
    animation: ce-toast-in 0.28s ease;
}
.ce-toast--success { border-left: 4px solid #16a34a; }
.ce-toast--error { border-left: 4px solid #dc2626; }
.ce-toast__icon { font-size: 18px; flex-shrink: 0; }
.ce-toast--success .ce-toast__icon { color: #16a34a; }
.ce-toast--error .ce-toast__icon { color: #dc2626; }
.ce-toast__msg { flex: 1; font-size: 13px; font-weight: 500; color: #1e293b; line-height: 1.4; }
.ce-toast__close {
    background: none;
    border: none;
    color: #94a3b8;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 13px;
    line-height: 1;
    flex-shrink: 0;
    transition: color 0.15s;
}
.ce-toast__close:hover { color: #475569; }
@keyframes ce-toast-in {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* confirmation popup (#tpdConfirmModal) */
.tpd-confirm-modal__message { font-size: 14px; color: #334155; line-height: 1.6; margin: 0; }

/* AI image suggestion preview (ai_courseimg modal) */
.tpd-page .tpd-ai-preview { width: 100%; text-align: center; }
.tpd-page .tpd-ai-preview__img {
    max-width: 100%;
    max-height: 320px;
    object-fit: contain;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
}

@media (max-width: 768px) {
    .tpd-page .topviewdetails.tpd-hero #tp_header.flex.flex-wrap { flex-direction: column; }
    .tpd-page .tpd-hero__media { width: 100%; }
    .tpd-page .tpd-hero__thumb { height: 160px; }
    .tpd-page .tpd-hero__thumb-overlay { opacity: 1; flex-direction: row; justify-content: center; }
    .tpd-page .tpd-hero__thumb-overlay .ph-btn { width: auto; }
    .tpd-page .tpd-hero__actions { width: 100%; min-width: 0; margin-left: 0; }
}
.cw-btn:hover { background: #4f46e5; }

/* ── Batch/Programs calendar — event schedule toolbar ─────────────────────── */
.tpd-batch-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 12px 16px;
    margin-bottom: 20px;
}
.tpd-batch-toolbar__filters.btn-group { display: flex; flex-wrap: wrap; gap: 8px; }
.tpd-batch-toolbar__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }

/* ── Batch/Programs calendar — sidebar filter & instructors panel ────────── */
#sched-sidebar-filters.sched-sidebar-section,
#sched-sidebar-attendees.sched-sidebar-section {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
}
#sched-sidebar-filters-dates-head,
#sched-sidebar-filters-types-head strong {
    display: flex !important;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #64748b;
}
#sched-sidebar-attendees h4 > a { display: flex; align-items: center; gap: 6px; }
#sched-sidebar-attendees h4 i.fa { color: #6366f1; }
#sched-sidebar-filters .checkbox label {
    display: flex !important;
    align-items: center;
    gap: 6px;
    padding-left: 29px;
}
#sched-sidebar-filters .checkbox label span {
    position: static !important;
    transform: none !important;
}
#sched-sidebar-filters .checkbox label i.fa {
    color: #94a3b8;
    font-size: 14px;
    /* width: 14px; */
    flex-shrink: 0;
    text-align: center;
}

/* ── Batch/Programs calendar — event-type accent tokens (shared: list card + calendar chip) ── */
.ev_2  { --ev-acc:#16a34a; --ev-tint:#eefcea; --ev-border:#9EDF7D; }
.ev_3  { --ev-acc:#3b5bdb; --ev-tint:#eef2ff; --ev-border:#B7CDFF; }
.ev_4  { --ev-acc:#b45309; --ev-tint:#fff7ea; --ev-border:#FFBC57; }
.ev_5  { --ev-acc:#9333ea; --ev-tint:#faf0ff; --ev-border:#EFC8FE; }
.ev_6  { --ev-acc:#0d9488; --ev-tint:#eafffb; --ev-border:#44F4C4; }
.ev_7  { --ev-acc:#a16207; --ev-tint:#fffce6; --ev-border:#FFFD67; }
.ev_8  { --ev-acc:#0369a1; --ev-tint:#eaf7ff; --ev-border:#38bdf8; }
.ev_9  { --ev-acc:#dc2626; --ev-tint:#fff0f0; --ev-border:#fc9a9a; }
.ev_11 { --ev-acc:#64748b; --ev-tint:#f4f4f2; --ev-border:#c9c9c0; }
.ev_12 { --ev-acc:#062eb7; --ev-tint:#eef1fb; --ev-border:#062eb7; }
.ev_13 { --ev-acc:#06addd; --ev-tint:#eafcff; --ev-border:#06addd; }
.ev_14 { --ev-acc:#009688; --ev-tint:#e9fbf8; --ev-border:#009688; }
.ev_16 { --ev-acc:#850e6d; --ev-tint:#fbeff8; --ev-border:#850e6d; }
.ev_17 { --ev-acc:#0076ff; --ev-tint:#eaf3ff; --ev-border:#0076ff; }
.ev_18 { --ev-acc:#7c1fd6; --ev-tint:#f6ecff; --ev-border:#8100ff; }

/* ── Batch/Programs calendar — two-column responsive layout ───────────────── */
/* Grid (not flex) so the sidebar track is a hard 300px that content can never stretch,
   and the content track (minmax(0,1fr)) can never be pushed around by it either. */
#sched-page-home.row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 20px;
    margin: 0 !important;
    align-items: start;
}
#sched-content-outer { min-width: 0; width: 100%; }
#sched-content-outer #sched-content.col-md-9 { width: 100% !important; float: none !important; padding: 0 !important; }
#sched-sidebar-outer { min-width: 0; width: 100%; overflow: hidden; }
#sched-sidebar-outer #sched-sidebar.col-md-3 { width: 100% !important; float: none !important; padding: 0 !important; }
#sched-sidebar-outer #sched-sidebar-inner {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
#sched-sidebar-outer #sched-sidebar-filters-type,
#sched-sidebar-outer #sched-sidebar-filters-type ul { width: 100%; min-width: 0; }
#sched-sidebar-filters-type li.checkbox { min-width: 0; }
#sched-sidebar-filters-type li.checkbox label,
#sched-sidebar-filters-type li.checkbox label span {
    min-width: 0;
    overflow-wrap: anywhere;
}
@media (max-width: 900px) {
    #sched-page-home.row { grid-template-columns: 1fr; }
    #sched-sidebar-outer { width: 100%; }
}

/* ── Batch/Programs calendar — list view: date pill + event cards ─────────── */
#sched-content-outer .sched-container-header { margin: 22px 0 12px !important; }
#sched-content-outer .sched-container-dates { line-height: 1.4 !important; }
#sched-content-outer .sched-container-dates a.sched-past-date {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    background: #1e293b !important;
    color: #fff !important;
    padding: 5px 14px !important;
    border-radius: 999px;
    font-size: 12px !important;
    font-weight: 700;
    line-height: 1.5 !important;
}
#sched-content-outer .sched-container { border-left: 0 !important; margin: 0 !important; }
#sched-content-outer .sched-container-inner { padding: 0 !important; }
#sched-content-outer .sched-container-inner::after { display: none !important; }
#sched-content-outer #sched-content-inner h3,
#sched-content-outer h3 {
    float: none !important;
    clear: none !important;
    width: auto !important;
    text-align: left !important;
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    margin: 16px 0 6px !important;
    padding: 3px 10px !important;
    background: #eef2ff !important;
    color: #4f46e5 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    border-radius: 999px;
    font-variant-numeric: tabular-nums;
}
#sched-content-outer .event {
    display: block !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100%;
    margin: 0 0 10px !important;
    padding: 14px 46px 12px 16px !important;
    background: #fff !important;
    border: 1px solid #eef2f7 !important;
    border-left: 4px solid var(--ev-border, #6366f1) !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .05) !important;
    text-shadow: none !important;
    transition: box-shadow .15s ease, transform .15s ease;
}
#sched-content-outer .event:hover { box-shadow: 0 10px 24px rgba(15, 23, 42, .08) !important; transform: translateY(-1px); }
#sched-content-outer .event .name {
    display: flex !important;
    align-items: center;
    gap: 8px;
    float: none !important;
    min-width: 0 !important;
    width: auto;
    line-height: 1.4 !important;
    font: 600 13.5px 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
    color: #1e293b;
}
#sched-content-outer .event .name span { font-weight: 400; }
#sched-content-outer .event .ev-type-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    min-width: 26px;
    border-radius: 7px;
    background: var(--ev-tint, #eef2ff);
    color: var(--ev-acc, #6366f1);
    font-size: 12px;
    flex-shrink: 0;
}
#sched-content-outer .sched-event-evpeople {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 999px;
    padding: 3px 10px;
    margin: 6px 6px 0 0 !important;
    font-size: 11.5px !important;
    font-weight: 500;
    color: #64748b !important;
    min-height: 0 !important;
}

#sched-content-outer .sched-event-evpeople.media-btn{
    border-radius: 10px;
    background: linear-gradient(135deg, #6366f1, #4f46e5);
    box-shadow: 0 2px 8px rgba(99, 102, 241, .35);
}

#sched-content-outer .sched-event-evpeople.media-btn a{
    color: white;
    font-size: 13px;
    text-transform: capitalize;
    font-weight: 600;
    letter-spacing: 0.5px;
    line-height: 1.2;
    padding: 3px 6px;
}
#sched-content-outer .sched-container-inner .navbar-nav.navbar-right { top: 12px !important; right: 10px !important; }
#sched-content-outer .dropdown-toggle .fa-cogs { color: #94a3b8; font-size: 14px; }
#sched-content-outer .dropdown-toggle:hover .fa-cogs { color: #6366f1; }
#sched-content-outer .dropdown-menu { border-radius: 10px; border: 1px solid #eef2f7; box-shadow: 0 10px 30px rgba(15, 23, 42, .12); padding: 6px; }
#sched-content-outer .dropdown-menu > li > a { border-radius: 6px; font-size: 12.5px; padding: 8px 12px; color: #334155; }
#sched-content-outer .dropdown-menu > li > a:hover { background: #f8fafc; color: #4f46e5; }
#sched-content-outer .alert.alert-danger.ai-tab-panel__empty {
    background: #f8fafc !important;
    border: 1px dashed #e2e8f0 !important;
    color: #64748b !important;
    border-radius: 12px !important;
    text-align: center;
    padding: 32px 24px !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
#sched-content-outer .alert.alert-danger.ai-tab-panel__empty i { font-size: 28px; color: #cbd5e1; }

/* ── Batch/Programs calendar — sidebar filter pills ────────────────────────── */
#sched-sidebar-filters-type ul { display: grid; grid-template-columns: repeat(1,1fr); gap: 8px; list-style: none; padding-left: 0; }
#sched-sidebar-filters-type li#sched-sidebar-filters-dates,
#sched-sidebar-filters-type li#sched-sidebar-filters-types-head { grid-column: 1 / -1; }
#sched-sidebar-filters-type li.checkbox {
    margin: 0 !important;
    clear: none !important;
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 8px;
    padding: 8px 10px !important;
    transition: background .15s ease, border-color .15s ease;
}
#sched-sidebar-filters-type li.checkbox.meeting:has(input:checked) { background: #eafffb; border-color: #44F4C4; }
#sched-sidebar-filters-type li.checkbox.live_stream:has(input:checked) { background: #fff0f0; border-color: #fc9a9a; }
#sched-sidebar-filters-type li.checkbox.Course:has(input:checked) { background: #eefcea; border-color: #9EDF7D; }
#sched-sidebar-filters-type li.checkbox.Classroom:has(input:checked) { background: #fff7ea; border-color: #FFBC57; }
#sched-sidebar-filters-type li.checkbox.Exam:has(input:checked) { background: #faf0ff; border-color: #EFC8FE; }
#sched-sidebar-filters-type li.checkbox.Assignment:has(input:checked) { background: #fffce6; border-color: #FFFD67; }
#sched-sidebar-filters-type li.checkbox.break_time:has(input:checked) { background: #f4f4f2; border-color: #c9c9c0; }
#sched-sidebar-filters-type li.checkbox.OnJobTraining:has(input:checked) { background: #eef1fb; border-color: #062eb7; }
#sched-sidebar-filters-type li.checkbox.practical_repro:has(input:checked) { background: #e9fbf8; border-color: #009688; }
#sched-sidebar-filters-type li.checkbox.media:has(input:checked) { background: #fbeff8; border-color: #850e6d; }
#sched-sidebar-filters-type li.checkbox.chatbot:has(input:checked) { background: #eaf3ff; border-color: #0076ff; }
#sched-sidebar-filters-type li.checkbox.survey:has(input:checked) { background: #f6ecff; border-color: #8100ff; }
@media (max-width: 480px) { #sched-sidebar-filters-type ul { grid-template-columns: 1fr; } }

/* ── Batch/Programs calendar — list/calendar view toggle (segmented) ──────── */
.tpd-batch-toolbar__actions .switch-field { display: inline-flex; background: #f1f5f9; border-radius: 9px; padding: 3px; gap: 3px; margin-top: 0 !important; }
.tpd-batch-toolbar__actions .switch-field input { position: absolute !important; opacity: 0; width: 0; height: 0; clip: auto !important; }
.tpd-batch-toolbar__actions .switch-field label {
    background: transparent !important;
    border: none !important;
    color: #94a3b8 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 38px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px !important;
    font-size: 14px;
}
.tpd-batch-toolbar__actions .switch-field input:checked + label { background: #fff !important; color: #6366f1 !important; box-shadow: 0 1px 5px rgba(0, 0, 0, .12); }
.tpd-batch-toolbar__actions .switch-field label:hover { color: #475569 !important; }
@media (max-width: 640px) { .tpd-batch-toolbar__actions .switch-field label { width: 44px; height: 44px; } }

/* ── Batch/Programs calendar — calendar view card + FullCalendar re-skin ──── */
#calendar { background: #fff; border: 1px solid #eef2f7; border-radius: 12px; box-shadow: 0 1px 3px rgba(15, 23, 42, .05); padding: 16px; overflow-x: auto; }
#calendar .fc { min-width: 640px; }
#calendar .fc-header-title h2 { font-size: 16px; font-weight: 700; color: #1e293b; }
#calendar .fc-button.fc-state-default {
    background: #fff;
    border: 1px solid #e2e8f0;
    color: #475569;
    text-shadow: none;
    box-shadow: none;
    border-radius: 8px !important;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 600;
    height: auto;
}
#calendar .fc-state-hover { background: #f8fafc; }
#calendar .fc-state-active, #calendar .fc-state-down { background: #6366f1 !important; border-color: #6366f1 !important; color: #fff !important; }
#calendar th.fc-widget-header { padding: 8px 0 !important; font-size: 14px !important; text-transform: uppercase; letter-spacing: .04em; color: #64748b; font-weight: 700; border: 0 !important; background: #f8fafc; }
#calendar .fc-widget-content { border-color: #eef2f7 !important; }
#calendar .fc-today { background: #eef2ff !important; }
#calendar .fc-day-number { font-size: 12px; font-weight: 600; color: #334155; padding: 6px 8px !important; }
#calendar .fc-content {
    border: 0 !important;
    padding: 8px 10px !important;
    border-radius: 8px;
    background: #f5f5ff !important;
    border-left: 3px solid var(--ev-border, #6366f1) !important;
    margin: 2px 0;
}
#calendar .fc-content .EventType { font-size: 8.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ev-acc, #4f46e5); margin-bottom: 2px; }
#calendar .fc-content .EventName { font-size: 11px !important; font-weight: 600 !important; color: #1e293b; line-height: 1.2;}
#calendar .fc-content .EventTime { font-size: 11px; color: #64748b; margin-top: 2px; display: flex;gap: 2px; }
#calendar .fc-content .EventTime i { color: #94a3b8 !important; }
#calendar .fc-toolbar .fc-right .fc-button-group{
    display: flex;
    gap: 7px;
}



/* ── Batch/Programs calendar — event-type color legend ─────────────────────── */
.tpd-batch-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 14px; padding-top: 14px; border-top: 1px solid #eef2f7; overflow-x: auto; }
.tpd-batch-legend__item { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: #64748b; white-space: nowrap; }
.tpd-batch-legend__dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }

/* ── Program Details / Edit Training Program form (programEdittrainingProgram.html) ── */
.pet-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}
.pet-toolbar__hint { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #64748b; margin: 0; }
.pet-toolbar__hint i { color: #6366f1; }
.pet-card {
    background: #fff;
    border: 1px solid #eef2f7 !important;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
    padding: 20px;
}
.pet-radio-group { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.pet-radio-group input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }
.pet-radio-group .pet-radio-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 999px;
    border: 1.5px solid #cbd5e1;
    background: #fff;
    color: #475569;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    margin: 0;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.pet-radio-group input[type="radio"]:checked + .pet-radio-pill {
    background: #eef2ff;
    border-color: #6366f1;
    color: #4f46e5;
}
.pet-radio-group input[type="radio"]:disabled + .pet-radio-pill { opacity: .5; cursor: not-allowed; }
.mv-form-label-row { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 12px; }
.mv-form-label-row .mv-form-label { margin-bottom: 0; }
.mv-form-label-row .ai_content.ph-btn {
    position: static;
    top: auto;
    right: auto;
    float: none;
    margin: 0;
}
.genwithAIlabel{
    justify-content: space-between;
    width:stretch;
}
.cke_chrome{
    width: stretch !important;
}
.material-switch--flush > label { left: 0; }
.pet-form-fields { width: 100%; }
.pet-view-grid { display: flex; flex-wrap: wrap; gap: 20px; }
.pet-view-col { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.pet-view-item { display: flex; flex-direction: column; gap: 3px; }
.pet-view-item__label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #6a7788;
}
.pet-view-item__label i { color: #6366f1; }
.pet-view-item__value { font-size: 13px; color: #1e293b; margin: 0; line-height: 1.5; }
.pet-form-footer {
    clear: both;
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #eef2f7;
}

/* ── Registration tab (registration.html) ──────────────────────────────── */
.reg-toggle-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 20px 0 4px;
}
.reg-toggle-card {
    flex: 1 1 240px;
    min-width: 220px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
}
.reg-toggle-card__label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
    margin: 0;
}
.reg-toggle-card__label i.fa:first-child {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    min-width: 30px;
    border-radius: 8px;
    background: #eef2ff;
    color: #6366f1;
    font-size: 13px;
}
.reg-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #eef2f7;
}
.reg-footer__note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    color: #64748b;
}
.reg-footer__note i { color: #6366f1; margin-top: 2px; }
.reg-footer__actions { display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 768px) {
    .reg-footer { flex-direction: column; align-items: stretch; }
    .reg-footer__actions { justify-content: flex-end; }
}

/* ── Pricing tab / Installments (pricing-addandViewInstallment.html) ──────── */
.pricing-form-wrap {
    /* max-width: 960px; */
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
}
.pricing-checkbox-row { display: flex; flex-wrap: wrap; gap: 12px; }
.pricing-checkbox-row .input-group { flex: 1 1 200px; }
.pricing-form-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 8px;
    padding-top: 16px;
    border-top: 1px solid #eef2f7;
}
.pricing-installments-panel { 
    margin-top: 20px; 
    /* max-width: 720px; */
 }
.pricing-installments-panel__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}
.pricing-installments-panel__header .installmentadd {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}
.pricing-installments-panel__header .installmentadd i { color: #6366f1; }

/* ── Coupons tab (pricing-coupon.html) ─────────────────────────────────────── */
.cpn-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 20px;
}
.cpn-toolbar__hint { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #64748b; margin: 0; }
.cpn-toolbar__hint i { color: #6366f1; }
.cpn-code {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    color: #6366f1;
    background: #eef2ff;
    border-radius: 6px;
    padding: 4px 10px;
    margin: 4px 0 10px;
    width: fit-content;
}
.cpn-code p { margin: 0; }
.cpn-pagination { display: flex; justify-content: center; margin-top: 16px; }
.cpn-course-list { display: flex; flex-direction: column; gap: 8px; }
.cpn-course-list__item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #334155;
    padding: 10px 12px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #f1f5f9;
}
.cpn-course-list__item i { color: #16a34a; }

/* ── Coupon card (matches .cpn-card in LCMS/CourseEditor course_editor.css,
   which isn't loaded on this page, so it's reproduced here) ───────────────── */
.cpn-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    padding-bottom: 16px;
}
.cpn-card {
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: box-shadow 0.2s, transform 0.2s;
}
.cpn-card:hover {
    box-shadow: 0 10px 32px rgba(99, 102, 241, 0.15);
    transform: translateY(-3px);
}
.cpn-card__header {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    padding: 20px 18px 16px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    min-height: 96px;
}
.cpn-card__circle { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, 0.10); pointer-events: none; }
.cpn-card__circle--tl { width: 90px; height: 90px; top: -36px; left: -24px; }
.cpn-card__circle--br { width: 64px; height: 64px; bottom: -22px; right: 14px; }
.cpn-card__discount { position: relative; z-index: 1; display: flex; align-items: baseline; gap: 4px; }
.cpn-card__discount-val { font-size: 38px; font-weight: 800; color: #ffffff; line-height: 1; letter-spacing: -1.5px; }
.cpn-card__discount-off { font-size: 13px; font-weight: 700; color: rgba(255, 255, 255, 0.70); letter-spacing: 1px; line-height: 1; padding-bottom: 4px; }
.cpn-card__header-icon { position: relative; z-index: 1; font-size: 42px; color: rgba(255, 255, 255, 0.18); line-height: 1; }
.cpn-card__tear {
    display: flex;
    align-items: center;
    background: #f8fafc;
    height: 20px;
    position: relative;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}
.cpn-card__notch { width: 20px; height: 20px; border-radius: 50%; background: #f5f6fa; border: 1px solid #e2e8f0; flex-shrink: 0; position: relative; z-index: 1; }
.cpn-card__notch--l { margin-left: -10px; }
.cpn-card__notch--r { margin-right: -10px; }
.cpn-card__dash { flex: 1; border-top: 2px dashed #e2e8f0; margin: 0 6px; }
.cpn-card__body { padding: 14px 18px 12px; flex: 1; display: flex; flex-direction: column; gap: 12px; }
.cpn-card__headerNew{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 0;
}
.cpn-card__name { font-size: 14px; font-weight: 700; color: #1e293b; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cpn-card__code {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #f1f5f9;
    border: 1.5px dashed #94a3b8;
    border-radius: 7px;
    padding: 5px 11px;
    align-self: flex-start;
}
.cpn-card__code-tag { font-size: 9px; font-weight: 700; color: #94a3b8; letter-spacing: 0.1em; text-transform: uppercase; line-height: 1; }
.cpn-card__code-val { font-size: 12px; font-weight: 700; color: #334155; letter-spacing: 0.08em; line-height: 1; }
.cpn-card__stats { display: flex; align-items: stretch; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; }
.cpn-card__stat { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 8px 4px; }
.cpn-card__stat-num { font-size: 14px; font-weight: 700; color: #1e293b; line-height: 1; }
.cpn-card__stat-num--date { font-size: 11px; }
.cpn-card__stat-lbl { font-size: 9px; font-weight: 600; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.04em; display: flex; align-items: center; gap: 3px; }
.cpn-card__stat-lbl i { font-size: 9px; }
.cpn-card__stat-sep { width: 1px; background: #e2e8f0; flex-shrink: 0; }
.cpn-card__footer { display: flex; border-top: 1px solid #e2e8f0; }
.cpn-card__action {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 8px;
    border: none;
    background: transparent;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.cpn-card__action + .cpn-card__action { border-left: 1px solid #e2e8f0; }
.cpn-card__action--edit { color: #6366f1; }
.cpn-card__action--edit:hover { background: #eef2ff; }
.cpn-card__action--deactivate { color: #dc2626; }
.cpn-card__action--deactivate:hover { background: #fef2f2; }
@media (max-width: 1100px) {
    .cpn-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .cpn-cards { grid-template-columns: 1fr; }
    .cpn-card__discount-val { font-size: 30px; }
}

/* ── Pricing tab / Payment status grid (pricing-PaymentStatus.html) ───────── */
.pay-grid-panel { width: 100%; padding: 4px; }
.pay-grid { width: 100%; height: 420px; position: relative; }
.pay-grid .ai-tab-panel__empty { position: absolute; inset: 0; background: #fff; z-index: 1; }

/* ── Pricing tab / Overhead Cost (pricing-OverHeadCost.html) ──────────────── */
.ohc-cost-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ohc-cost-row .input-group { flex: 1 1 220px; }
.ohc-custom-row {
    padding: 14px;
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 10px;
}
.ohc-custom-row__label { max-width: 280px; margin-bottom: 10px; }
.ohc-remove-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 8px;
    background: #fef2f2;
    color: #dc2626 !important;
    border: 1px solid #fecaca;
    text-decoration: none !important;
    flex-shrink: 0;
}
.ohc-remove-btn:hover { background: #fee2e2; }

/* ── Learners tab / Student List (learners-student_listing.html) ──────────── */
.lrn-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 12px 16px;
    margin-bottom: 16px;
}
.lrn-toolbar__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.lrn-toolbar__count { flex-shrink: 0; }
.lrn-grid-panel { width: 100%; padding: 4px; }
.lrn-grid { width: 100%; height: 420px; position: relative; }
.lrn-grid .ai-tab-panel__empty { position: absolute; inset: 0; background: #fff; z-index: 1; }
.bulk-upload-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.nAssignModbody i.nAssignModbody--success { background: #dcfce7 !important; color: #16a34a !important; }
.nAssignModbody i.nAssignModbody--warning { background: #fef3c7 !important; color: #b45309 !important; }

/* ── Learners tab / Attendance (learner-attendance.html) ───────────────────── */
.attn-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
}
.attn-toolbar__filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px; }
.attn-toolbar__field { display: flex; flex-direction: column; gap: 6px; min-width: 160px; }
.attn-toolbar__field label { font-size: 12px; font-weight: 600; color: #64748b; margin: 0; }
.attn-toolbar__field--btn { min-width: 0; }
.attn-toolbar__side { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.attendance_legends { display: flex; align-items: center; gap: 14px; margin: 0; padding: 0; list-style: none; }
.attendance_legends li { display: flex; align-items: center; gap: 5px; font-size: 12px; color: #64748b; }
.attn-legend-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.attn-legend-dot--present { background: #16a34a; }
.attn-legend-dot--absent { background: #dc2626; }

.attn-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.attn-table th { border: 1px solid #eef2f7; }

.attn-th-learner {
        min-width: 150px;
    background: #eef2ff;
    color: #4338ca;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 10px;
    vertical-align: middle;
    text-align: center;
}
.attn-th-events {
    background: #6366f1;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-align: center;
    padding: 10px;
}
.attn-row-flex { display: flex; }
.attn-row-inline-flex { display: inline-flex; }

.attn-event-cell { background: #f8fafc; padding: 0; vertical-align: top; font-weight: 400; }
.attn-event-cell__body { min-width: 150px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.attn-event-cell__type { font-size: 11px; font-weight: 700; color: #6366f1; text-transform: uppercase; letter-spacing: .03em; }
.attn-event-cell__title { font-size: 12px; font-weight: 600; color: #1e293b; }
.attn-event-cell__dates { margin: 0; font-size: 11px; color: #64748b; }
.attn-event-cell--instructor { background: #fff; }
.attn-event-cell--instructor .attn-event-cell__body { padding: 6px 12px; }
.attn-instructor-label { display: block; font-size: 10px; font-weight: 700; color: #94a3b8; text-transform: uppercase; letter-spacing: .03em; }
.attn-instructor-name { margin: 0; font-size: 12px; color: #374151; }

.attn-th-name {
    background: #fff;
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
    padding: 10px 12px;
    text-align: left;
    white-space: nowrap;
}

.attn-data-cell {
    min-width: 150px;
    height: 45px;
    padding: 6px;
}
.attn-status { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.attn-status--present { background: #dcfce7; color: #15803d; }
.attn-status--absent { background: #fee2e2; color: #dc2626; }
.attn-status--pending { background: #dbeafe; color: #1d4ed8; }

/* ── Learners tab / Awards leaderboard (learner_Award.html) ───────────────── */
.award-panel {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
    gap: 20px;
    align-items: start;
}
@media (max-width: 1024px) {
    .award-panel { grid-template-columns: 1fr; }
}
.award-panel__main {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .08);
}
.award-panel__side { position: sticky; top: 16px; }

.award-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.award-header .award-title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 700; color: #1e293b; }
.award-header .award-title i { color: #f59e0b; }
.award-header__search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 6px 14px;
}
.award-header__search i { color: #94a3b8; font-size: 12px; }
.award-header__search .award-search-input { border: none; padding: 0; background: transparent; font-size: 13px; }

.award-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 16px 0;
    padding-bottom: 16px;
    border-bottom: 1px solid #eef2f7;
}
.award-day-filter { display: flex; flex-wrap: wrap; gap: 6px; }
.award-toolbar__filterby { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.award-select {
    min-height: 38px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 13px;
    color: #374151;
    background: #fff;
}
.award-select:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .15); }
.award-selected-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.award-selected-chips .mc-chip i { margin-left: 2px; cursor: pointer; padding: 4px; }

.award-list { display: flex; flex-direction: column; gap: 10px; }
.award-list__item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 14px;
    border: 1px solid #f1f5f9;
    border-radius: 10px;
    background: #fff;
    transition: background .15s ease, box-shadow .15s ease;
}
.award-list__item:hover { background: #f8fafc; box-shadow: 0 2px 8px rgba(15, 23, 42, .06); }
.award-list__item--active { background: #eef6fb; border-color: #bfe3f5; }

.award-rank {
    flex: 0 0 32px;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    background: #f1f5f9;
    color: #64748b;
}
.award-rank--gold { background: #fef3c7; color: #b45309; }
.award-rank--silver { background: #e2e8f0; color: #475569; }
.award-rank--bronze { background: #fde4cf; color: #b45309; }

.award-avatar { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; background: #f1f5f9; }

.award-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 10px 0;
}
.award-name:hover, .award-name:focus { color: #6366f1; text-decoration: none; }

.mc-chip--points { flex: 0 0 auto; background: linear-gradient(135deg, #fffbeb, #fef3c7); border-color: rgba(252, 211, 77, .5); color: #b45309; font-weight: 600; }
.mc-chip--points i { opacity: 1; color: #d97706; }

.award-bonus-card {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .08);
}
.award-bonus-card h3 { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; color: #1e293b; margin: 0 0 16px; }
.award-bonus-card h3 .fa { color: #f59e0b; }

.award-showmore { text-align: center; margin-top: 14px; }

@media (max-width: 640px) {
    .award-list__item { flex-wrap: wrap; }
    .award-name { flex: 1 1 100%; order: 1; padding: 0; }
    .mc-chip--points { order: 2; }
}

/* ── Learners tab / Learning Group (learners-LearnerGroup.html) ───────────── */
.creategroupbox { display: flex; align-items: center; justify-content: center; }
.creategroupbox .boxgroup { text-align: center; }
.creategroupbox .boxgroup .ph-btn { margin-top: 10px; }
.grouphead { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.grouphead__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── Learners tab / Nomination Request (Learner-NominationRequest.html) ───── */
.nom-toolbar { margin-bottom: 16px; }
.nom-toolbar__stats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.nom-toolbar__stats .mc-chip b { margin-left: 2px; }

/* ── Learners tab / Past Learners (learner-pastLearners.html) ─────────────── */
.pl-toolbar {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
}
.pl-toolbar__label { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #94a3b8; margin: 0 0 10px; }
.pl-toolbar__label i { color: #6366f1; }
.pl-toolbar__fields { display: flex; flex-wrap: wrap; gap: 12px; }
.pl-toolbar__fields .mg-right { flex: 1 1 200px; position: relative; }
.pl-toolbar__fields .mg-right i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: 12px;
}
.pl-toolbar__fields .mg-right input {
    width: 100% !important;
    position: static !important;
    left: auto !important;
    height: 38px !important;
    padding-left: 32px !important;
}

/* ── Learners tab / Companies List (learner-CompaniesList.html) ───────────── */
.cl-toolbar { margin-bottom: 16px; }

/* ── Shared: pagination wrapper & compact modal footer (used by several       */
/*    Learners-tab templates, e.g. learner-Interested.html, learners-         */
/*    student_listing.html, pricing-coupon.html)                              */
.paginationOuter { text-align: center; padding: 10px 0; }
.modNewfooter { padding: 10px 40px !important; margin: 0 !important; border-top: 1px solid #e6e6e6 !important; text-align: center !important; }

/* ── Learners tab / Interested (learner-Interested.html) ──────────────────── */
.int-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.int-progress { margin-bottom: 0; }

/* ── Performance tab / Courses (course-progress.html) ──────────────────────── */
ul.Course_Groups_Set.list-unstyled li img {
    height: auto;
    width: 65px;
    border-radius: 6px;
    display: unset;
    position: absolute;
    object-fit: cover;
    background: #ddd;
}
ul.list-unstyled.Course_Groups_Set div {
    display: flex;
    margin-left: 73px;
    flex-direction: column;
    gap: 2px;
}
ul.Course_Groups_Set li.active a {
    color: #1c1c1c;
    line-height: 1.2;
    font-size: 14px;
}
ul.list-unstyled.Course_Groups_Set div span {
    font-size: 11px;
}
.cp-toolbar { display: flex; justify-content: flex-end; margin-bottom: 16px; }
.cp-toolbar__search { width: 100%; max-width: 280px; }

/* cp-panel / cp-layout / cp-course-list / cp-progress — modern two-pane redesign */
.cp-panel__header { display: flex; align-items: center; margin-bottom: 16px; }
.cp-panel__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; font-weight: 700; color: #0f172a; }
.cp-panel__title i { color: #6366f1; }

.cp-layout {
    display: flex;
    align-items: flex-start;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
    overflow: hidden;
}

.cp-sidebar {
    flex: 0 0 300px;
    max-width: 300px;
    width: 300px;
    box-sizing: border-box;
    padding: 16px;
    border-right: 1px solid #eef2f7;
    background: #f8fafc;
}

.cp-sidebar__search { margin-bottom: 14px; }

.cp-course-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 560px;
    overflow-y: auto;
}

.cp-course-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    border: 1.5px solid transparent;
    border-radius: 12px;
    cursor: pointer;
    min-height: 44px;
    transition: background .15s ease, border-color .15s ease;
}
.cp-course-item:hover { background: #eef2ff; }
.cp-course-item--active { background: #fff; border-color: #c7d2fe; box-shadow: 0 4px 14px rgba(99, 102, 241, .16); }

.cp-course-item__thumb { width: 48px; height: 48px; border-radius: 10px; object-fit: cover; background: #e2e8f0; flex-shrink: 0; }

.cp-course-item__body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }

.cp-course-item__title {
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cp-course-item--active .cp-course-item__title { color: #4338ca; }

.cp-course-item__due { display: flex; align-items: center; gap: 4px; font-size: 11px; color: #64748b; }
.cp-course-item__due i { color: #94a3b8; font-size: 10px; }

.cp-main { flex: 1; min-width: 0; width: 100%; box-sizing: border-box; padding: 20px; }

.cp-progress { position: relative; height: 8px; min-width: 100px; border-radius: 999px; background: #eef2f7; overflow: hidden; margin-bottom: 4px; }
.cp-progress__bar { width: 0; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #6366f1, #8b5cf6); transition: width .3s ease; }
.cp-progress--empty { background: repeating-linear-gradient(135deg, #eef2f7, #eef2f7 4px, #e2e8f0 4px, #e2e8f0 8px); }
.cp-progress__label { font-size: 11px; font-weight: 600; color: #475569; }
.cp-progress__label--muted { color: #94a3b8; font-weight: 500; font-style: italic; }

@media (max-width: 767px) {
    .cp-layout { flex-direction: column; }
    .cp-sidebar { flex: 1 1 auto; max-width: 100%; width: 100%; border-right: none; border-bottom: 1px solid #eef2f7; }
    .cp-course-list { max-height: 280px; }
    .cp-toolbar { justify-content: stretch; }
    .cp-toolbar__search { max-width: 100%; }
}

/* ── Performance tab / Resource Library (Resource_Library.html) ───────────── */
.res-video { width: 100%; min-height: 100px; }
.res-asp-table { overflow: hidden; }
.res-header { display: flex; align-items: center; margin-bottom: 16px; }
.res-header__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; font-weight: 700; color: #0f172a; }
.res-header__title i { color: #6366f1; }

/* ── Performance tab / Assessment & Survey (Assessment-courses.html) ──────── */
.assess-search { position: relative; }
.assess-search > i.fa-search {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: 12px;
    pointer-events: none;
}
.assess-search > input[type="text"] { padding-left: 28px; font-size: 14px;}
.assess-hr { margin: 5px 0 10px 0; }
.assess-crosstab { border: 1px solid #e2e8f0; }
.assess-survey-row { width: 100%; }
.assess-card-desc {
    font-size: 13px;
    color: #64748b;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Exam/survey card skin — layers on top of .lst-cards__item */
.assess-card {
    border-top: 4px solid #6366f1 !important;
    transition: box-shadow .2s ease, transform .2s ease;
}
.assess-card:hover { box-shadow: 0 18px 44px rgba(99, 102, 241, .20); }
.assess-card--survey { border-top-color: #0d9488 !important; }
.assess-card--survey:hover { box-shadow: 0 18px 44px rgba(13, 148, 136, .20); }

.assess-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 14px 16px 0;
}
.assess-card__icon {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: linear-gradient(135deg, #eef2ff, #e0e7ff);
    color: #6366f1;
    font-size: 15px;
}
.assess-card--survey .assess-card__icon {
    background: linear-gradient(135deg, #ecfeff, #ccfbf1);
    color: #0d9488;
}

.assess-card .lst-cards__body { padding-top: 10px; gap: 8px; }
.assess-card .lst-cards__title { font-size: 1rem; line-height: 1.35; }
.assess-card .lst-cards__title a:hover { color: #6366f1; }
.assess-card--survey .lst-cards__title a:hover { color: #0d9488; }

.assess-card__stats {
    padding-top: 10px;
    margin-top: 2px;
    border-top: 1px dashed #eef2f7;
}

.assess-card .lst-cards__actions { background: #fafbff; }
.assess-card--survey .lst-cards__actions { background: #f7fdfc; }

/* Webinar / Live Video Call card — modern skin, layers on top of .lst-cards__item */
.wc-card {
    border: none !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 10px 28px rgba(15, 23, 42, .05);
    transition: box-shadow .25s ease, transform .25s ease;
}
.wc-card:hover:not(.skel-card) { box-shadow: 0 20px 46px rgba(99, 102, 241, .18); transform: translateY(-3px); }

.wc-card__banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 13px 16px;
    background: linear-gradient(120deg, #6366f1 0%, #8b5cf6 100%);
}
.wc-card__banner--video { background: linear-gradient(120deg, #0891b2 0%, #0d9488 100%); }

.wc-card__banner-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
.wc-card__banner-icon {
    width: 30px;
    height: 30px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: rgba(255, 255, 255, .22);
    color: #fff;
    font-size: 14px;
}
.wc-card__banner-label {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.wc-card__banner .mc-badge { background: rgba(255, 255, 255, .95); box-shadow: 0 1px 4px rgba(15, 23, 42, .18); flex-shrink: 0; }

.wc-card .lst-cards__body { padding: 16px; gap: 10px; }

.wc-card__title-row { display: flex; align-items: flex-start; gap: 12px; }
.wc-card__datebadge {
    flex-shrink: 0;
    width: 44px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #eef2ff;
    border: 1px solid #e0e7ff;
    padding: 5px 0 6px;
    line-height: 1.15;
}
.wc-card__datebadge--video { background: #ecfeff; border-color: #cffafe; }
.wc-card__datebadge-month { font-size: 10px; font-weight: 700; letter-spacing: .04em; color: #6366f1; text-transform: uppercase; }
.wc-card__datebadge--video .wc-card__datebadge-month { color: #0d9488; }
.wc-card__datebadge-day { font-size: 17px; font-weight: 800; color: #1e293b; }

.wc-card__title-col { min-width: 0; flex: 1 1 auto; }
.wc-card .lst-cards__title { font-size: 1rem; font-weight: 700; line-height: 1.35; margin: 0 0 3px; }
.wc-card__time { display: flex; align-items: center; gap: 5px; font-size: 12px; color: #64748b; font-weight: 500; }
.wc-card__time i { color: #94a3b8; font-size: 11px; }

.wc-card__desc {
    font-size: 13px;
    color: #64748b;
    line-height: 1.5;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.wc-card__desc--empty { color: #94a3b8; font-style: italic; }

.wc-card__access {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.wc-card__access-title {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #94a3b8;
}
.wc-card__detail-row { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.wc-card__detail-label { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; color: #64748b; }
.wc-card__detail-label i { color: #a5b4fc; font-size: 11px; }
.wc-card__detail-value { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 12.5px; color: #334155; }
.wc-card__link {
    color: #4f46e5;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    flex: 1 1 auto;
}
.wc-card__link:hover { text-decoration: underline; }
.wc-card__copy { flex-shrink: 0; }

.wc-card__note {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 12px;
    color: #94a3b8;
    font-style: italic;
}
.wc-card__note i { margin-top: 2px; }

.wc-card .lst-cards__actions { background: #fafbff; padding: 12px 16px; }
.wc-card__cta { width: 100%; justify-content: center; }

@media (max-width: 639px) {
    .wc-card__detail-value { flex-wrap: wrap; }
}

/* ============================================
   SKELETON LOADING STATE — project-wide standard.
   Use these primitives (not a spinner/GIF) for any
   in-page loading state: card grids, table rows,
   panels, etc. See DESIGN_STANDARDS.md → "Skeleton
   Loading State" for the full pattern and usage.
   ============================================ */
.skel-card { cursor: default; }

.skel {
    display: block;
    border-radius: 6px;
    background: linear-gradient(90deg, #d8dee7 25%, #e7ebf1 37%, #d8dee7 63%);
    background-size: 400% 100%;
    animation: skel-shimmer 1.4s ease infinite;
}
@keyframes skel-shimmer {
    0% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}

.skel--banner { width: 100%; height: 56px; border-radius: 0; background-image: linear-gradient(90deg, #d8dee7 25%, #e3e7ed 37%, #d8dee7 63%); }
.skel--datebadge { width: 44px; height: 44px; border-radius: 10px; flex-shrink: 0; }
.skel--icon { width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0; }
.skel--title { width: 70%; height: 15px; margin-bottom: 6px; }
.skel--line { width: 100%; height: 10px; margin-bottom: 6px; }
.skel--line-sm { width: 55%; margin-bottom: 2px; }
.skel-row { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.skel--badge { width: 74px; height: 22px; border-radius: 20px; }
.skel--chip { width: 92px; height: 20px; border-radius: 20px; }
.skel--btn { width: 130px; height: 30px; border-radius: 999px; }
.skel--btn-full { width: 100%; height: 34px; border-radius: 999px; }
.skel--icon-lg { width: 46px; height: 46px; border-radius: 10px; flex-shrink: 0; }
.skel--avatar { width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0; }
.skel--avatar-sm { width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0; }
.skel--thumb { width: 50px; height: 50px; border-radius: 8px; flex-shrink: 0; }

@media (prefers-reduced-motion: reduce) {
    .skel { animation: none; }
}

/* Suppresses the global spin.js loader on pages that render their own
   skeleton loading state (added at runtime via a class, not markup, so it
   never touches the shared layout files). */
.mv-hide-global-loader { display: none !important; }

/* Community wall — post skeleton (Views/Community/CurriculumCommunity.cshtml).
   Shown while the initial feed loads, in place of the spin.js loader. Bones use
   the .skel primitives above. */
.cc-skel-post {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    padding: 16px;
    margin-bottom: 16px;
}
.cc-skel-post__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.cc-skel-post__head .skel--icon { width: 42px; height: 42px; border-radius: 50%; }
.cc-skel-post__meta { flex: 1; min-width: 0; }
.cc-skel-post__meta .skel--title { width: 40%; margin-bottom: 8px; }
.cc-skel-post__meta .skel--line-sm { width: 25%; margin-bottom: 0; }
.cc-skel-post__body .skel--banner { height: 180px; border-radius: 10px; margin-top: 12px; }

/* Expert Connection card — modern profile-style card, layers on top of .lst-cards__item */
.xpc-card {
    border: none !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 10px 28px rgba(15, 23, 42, .05);
    transition: box-shadow .25s ease, transform .25s ease;
    position: relative;
}
.xpc-card:hover:not(.skel-card) { box-shadow: 0 20px 46px rgba(99, 102, 241, .18); transform: translateY(-3px); }

.xpc-card__banner { height: 64px; background: linear-gradient(120deg, #6366f1 0%, #8b5cf6 100%); flex-shrink: 0; }
.xpc-card .skel--banner { height: 64px; }

.xpc-card__rate {
    position: absolute;
    top: 12px;
    right: 12px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
    background: rgba(255, 255, 255, .95);
    padding: 5px 10px;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(15, 23, 42, .18);
}
.xpc-card__rate-label { font-size: 9.5px; font-weight: 600; color: #94a3b8; white-space: nowrap; }
.xpc-card__rate-amount { font-size: 13px; font-weight: 700; color: #6366f1; white-space: nowrap; }

.xpc-card__avatar-wrap { display: flex; justify-content: center; margin-top: -38px; position: relative; }
.xpc-card__avatar {
    width: 76px;
    height: 76px;
    border-radius: 50%;
    overflow: hidden;
    border: 4px solid #fff;
    box-shadow: 0 2px 12px rgba(99, 102, 241, .25);
    background: #e0e7ff;
    flex-shrink: 0;
}
.xpc-card__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xpc-card__avatar-skel { width: 76px; height: 76px; border-radius: 50%; border: 4px solid #fff; box-shadow: 0 2px 12px rgba(99, 102, 241, .15); }

.xpc-card__online {
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #22c55e;
    border: 3px solid #fff;
    right: calc(50% - 34px);
    bottom: 2px;
    box-shadow: 0 0 0 1px rgba(34, 197, 94, .35);
}

.xpc-card__body { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 10px 16px 16px; flex: 1; }
.xpc-card__name { font-size: 1rem; font-weight: 700; margin: 0; line-height: 1.3; }
.xpc-card__name a { color: #1e293b; text-decoration: none; }
.xpc-card__name a:hover { color: #6366f1; }

.xpc-card .lst-cards__meta { justify-content: center; }

.xpc-card__bio {
    font-size: 12.5px;
    color: #64748b;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.xpc-card .lst-cards__actions { justify-content: center; background: #fafbff; }
.xpc-card__cta { width: fit-content; justify-content: center; font-size: 13px !important; }
.xpc-card__cta svg{
    height: 17px;
    width: 17px;
}

@media (max-width:600px){
    .xpc-card__avatar {
    width:65px;
    height:65px;
}
.xpc-card__cta {
    width: fit-content;
    font-size: 14px !important;
}
.xpc-card__rate {
    align-items: center;
}
.modal-lg{
    width: stretch !important;
}
}

/* Expert Details page — profile hero + info panels */
.xpd-wrap { display: flex; flex-direction: column; gap: 20px; }

.xpd-hero {
    display: flex;
    align-items: center;
    gap: 24px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
    padding: 24px;
    box-sizing: border-box;
}

.xpd-hero__avatar-wrap { position: relative; flex-shrink: 0; }
.xpd-hero__avatar {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    overflow: hidden;
    border: 4px solid #eef2ff;
    box-shadow: 0 2px 12px rgba(99, 102, 241, .2);
    background: #e0e7ff;
}
.xpd-hero__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.xpd-hero__avatar-skel { width: 100px; height: 100px; border-radius: 50%; border: 4px solid #eef2ff; box-shadow: 0 2px 12px rgba(99, 102, 241, .2); }
.xpd-hero__online {
    position: absolute;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #22c55e;
    border: 3px solid #fff;
    right: 4px;
    bottom: 4px;
    box-shadow: 0 0 0 1px rgba(34, 197, 94, .35);
    z-index: 1;
}

.xpd-hero__info { flex: 1; min-width: 0; }
.xpd-hero__name { margin: 0 0 10px; font-size: 20px !important; font-weight: 800 !important; color: #0f172a; }

.xpd-hero__facts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.xpd-hero__facts li { font-size: 13.5px; color: #475569; display: flex; align-items: center; gap: 8px; }
.xpd-hero__facts li i { color: #6366f1; font-size: 14px; flex-shrink: 0; }
.xpd-hero__facts li b { color: #1e293b; font-weight: 700; }

.xpd-hero__actions {
    flex: 0 0 240px;
    max-width: 240px;
    width: 240px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: 24px;
    border-left: 1px solid #eef2f7;
}
.xpd-hero__rate { display: flex; flex-direction: column; align-items: center; gap: 1px; margin-bottom: 4px; }
.xpd-hero__rate-amount { font-size: 20px; font-weight: 800; color: #6366f1; }
.xpd-hero__rate-label { font-size: 11px; font-weight: 600; color: #94a3b8; }
.xpd-hero__cta { width: 100%; justify-content: center; }
.xpd-hero__cta:focus, .xpd-hero__cta:active { outline: none; }
.xpd-hero__feedback-link {
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: #6366f1;
    text-decoration: none;
    margin-top: 4px;
}
.xpd-hero__feedback-link:hover { color: #4f46e5; text-decoration: underline; }
.xpd-hero__feedback-link:focus, .xpd-hero__feedback-link:active { outline: none; }

.xpd-grid { display: flex; gap: 20px; align-items: flex-start; }
.xpd-col-side { flex: 0 0 320px; max-width: 320px; width: 320px; box-sizing: border-box; display: flex; flex-direction: column; gap: 20px; }
.xpd-col-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 20px; }

.xpd-panel {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
    padding: 22px 24px;
    box-sizing: border-box;
}
.xpd-panel__title { margin: 0 0 14px; font-size: 15px !important; font-weight: 800 !important; color: #0f172a; }
.xpd-panel__bio { margin: 0; font-size: 13.5px; color: #64748b; line-height: 1.7; }

.xpd-review-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.xpd-review { display: flex; gap: 10px; padding: 14px 16px; background: #f8fafc; border-radius: 12px; border-left: 3px solid #6366f1; }
.xpd-review i { color: #6366f1; font-size: 14px; flex-shrink: 0; margin-top: 2px; }
.xpd-review p { margin: 0; font-size: 13.5px; color: #475569; line-height: 1.7; }

.xpd-tags-grid { display: flex; flex-wrap: wrap; gap: 20px; }
.xpd-tags-col { flex: 1 1 200px; min-width: 200px; }
.xpd-tags-col__title { margin: 0 0 10px; font-size: 13px; font-weight: 700; color: #334155; }
.xpd-tags { display: flex; flex-wrap: wrap; gap: 8px; }

@media (max-width: 1023px) {
    .xpd-hero { flex-wrap: wrap; }
    .xpd-hero__actions { flex: 1 1 100%; max-width: 100%; width: 100%; padding-left: 0; border-left: none; border-top: 1px solid #eef2f7; padding-top: 16px; flex-direction: row; flex-wrap: wrap; }
    .xpd-hero__rate { flex: 0 0 100%; }
    .xpd-hero__cta { flex: 1 1 auto; }
    .xpd-hero__feedback-link { flex: 0 0 100%; }
    .xpd-grid { flex-direction: column; }
    .xpd-col-side { flex: 1 1 auto; max-width: 100%; width: 100%; }
}

@media (max-width: 640px) {
    .xpd-hero { flex-direction: column; text-align: center; padding: 20px; }
    .xpd-hero__info { text-align: left; }
}

/* Assessment/Survey detail view — header summary card */
.assess-detail-panel {
    display: flex;
    gap: 24px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
    padding: 22px 24px;
    margin-bottom: 20px;
    box-sizing: border-box;
}
.assess-detail-main { flex: 1; min-width: 0; }
.assess-detail-title { margin: 0 0 10px; font-size: 22px; font-weight: 800; color: #0f172a; }
.assess-detail-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.assess-detail-desc { font-size: 14px; color: #475569; line-height: 1.6; margin: 0 0 8px; }
.assess-detail-sub { font-size: 13px; color: #64748b; margin: 0 0 6px; }
.assess-detail-sub strong { color: #334155; }

.assess-detail-facts {
    flex: 0 0 280px;
    max-width: 280px;
    width: 280px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: 24px;
    border-left: 1px solid #eef2f7;
}
.assess-detail-fact { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 13px; }
.assess-detail-fact__label { color: #94a3b8; font-weight: 600; flex-shrink: 0; }
.assess-detail-fact__value { color: #0f172a; font-weight: 700; text-align: right; }
.assess-detail-fact__note { display: inline-block; margin-left: 6px; color: #dc2626; font-weight: 600; font-size: 11px; }

@media (max-width: 767px) {
    .assess-detail-panel { flex-direction: column; }
    .assess-detail-facts { flex: 1 1 auto; max-width: 100%; width: 100%; padding-left: 0; border-left: none; border-top: 1px solid #eef2f7; padding-top: 14px; }
}

/* ── Performance tab / Create Quiz wizard (Assessment-createquiz.html) ────── */
.cq-alert { font-size: 17px; }
.cq-warning-box {
    border: 1px solid #d2b5b5;
    font-size: 17px;
    color: #ea587a;
    text-align: center;
    font-weight: 800;
}
.cq-step-label { color: chocolate; }
.cq-benchmark-label { font-size: 15px; text-align: center; }
.cq-branch-chip { border: 1px solid #eee; padding: 5px 8px; margin-bottom: 8px; margin-right: 8px; }
.cq-branch-chip__remove { cursor: pointer; }
.branchsavebuttons { padding: 20px; text-align: left; }
.cq-match-preview__panel { border: 1px solid #e2e8f0; }
.cq-match-preview__col { float: left; margin-right: 20px; }
.cq-match-preview__list { line-height: 55px; }
.cq-match-preview__list--right { line-height: 58px; }
.cq-match-preview__chip { font-size: 20px; border: 1px solid #ddd; padding: 10px 30px; }
.cq-status-icon { font-size: 16px; color: #f4cb00; }
.cq-eval-link { color: #1c44dc; text-decoration: underline; cursor: pointer; }

/* ── Performance tab / View Assignment (Assignment-viewAssignment.html) ───── */
.va-search { position: relative; display: inline-block; }
.va-search > i.fa-search {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: 12px;
    pointer-events: none;
}
.va-search > input.searchhere { 
        padding-left: 28px;
    border: 1px solid #e6e6e6;
    font-size: 13px;
}
.va-iframe-body { background: #f6f8fc; }

.va-toolbar { justify-content: flex-start; }
.va-toolbar__search { margin-left: auto; }

.va-group-list { display: flex; flex-direction: column; gap: 18px; margin-top: 16px; }

.va-group-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #6366f1;
    border-radius: 14px !important;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
    padding: 18px 20px;
    transition: box-shadow .2s ease;
}
.va-group-card:hover { box-shadow: 0 16px 40px rgba(15, 23, 42, .10); }

.va-group-card__head { margin-bottom: 12px; }
.va-group-card__title-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 6px; }
.va-group-card__title { margin: 0; font-size: 17px; font-weight: 800; color: #0f172a; }
.va-group-card__title a { color: inherit; text-decoration: none; }
.va-group-card__title a:hover { color: #6366f1; }
.va-group-card__meta { margin-bottom: 8px; }
.va-group-card__desc { font-size: 13px; color: #64748b; line-height: 1.55; }

.va-group-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 0;
    margin-bottom: 12px;
    border-top: 1px dashed #eef2f7;
    border-bottom: 1px dashed #eef2f7;
}

.va-status-row { display: flex; flex-wrap: wrap; gap: 6px; }

@media (max-width: 767px) {
    .va-toolbar { flex-wrap: wrap; }
    .va-toolbar__search { margin-left: 0; width: 100%; }
    .va-toolbar__search .va-search { display: block; width: 100%; }
    .va-toolbar__search input.searchhere { width: 100%; box-sizing: border-box; }
    .va-toolbar__cta { width: 100%; justify-content: center; }
}

/* ── Performance tab / Performance Rubrics — View/Edit (performanceRubricsViewEdit.html) ── */
/* NOTE: these rules used to live in an unscoped local <style> block (bare `table`,
   `th, td`, `button`, `input[type=...]`, `.container`, `.modal-dialog` selectors) that
   would have applied to every table/button/input on any tab of this SPA. Scoped under
   .prm-view (and #SelectMetrics for the modal) to fix that leak. Table chrome (borders,
   header background, padding) now comes from .lst-grid instead of bare table/th/td rules,
   which used to fight with the shared listing styles. */
.prm-select-metrics-dialog { width: 70vw; max-height: 70vh; }
@media (max-width: 768px) {
    .prm-select-metrics-dialog { width: auto; max-height: 100%; }
}
.prm-view .selectMetrics { margin: 20px 0; }
.prm-view .container { max-width: 100%; width: 100%; box-sizing: border-box; }
.prm-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.prm-header__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 700; color: #0f172a; }
.prm-header__title i { color: #6366f1; }
.prm-scroll { overflow-x: auto; }
.prm-view .group-header td { background-color: #eef2ff !important; font-weight: 700; color: #4338ca; }
.prm-view .highlighted-row { background-color: #ffffc0; }
.prm-view input[type="checkbox"] { width: 16px; height: 16px; }
.prm-input {
    width: 90%;
    padding: 7px 10px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 13px;
    color: #1e293b;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.prm-input:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.prm-view input:disabled { background-color: #f5f5f5; color: #888; }
.prm-view .buttons { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; }
.prm-view .error-message { color: #e53935; }
.prm-check-col { width: 40px; }
.prm-icon-btn { background: none; border: none; cursor: pointer; padding: 6px 10px; border-radius: 8px; transition: background .15s ease; }
.prm-icon-btn--danger { color: #dc2626; }
.prm-icon-btn--danger:hover { background: #fee2e2; }

/* ── Performance tab / Performance Rubrics — Upload Custom (performanceRubricsUploadCustom.html) ── */
/* NOTE: same leak issue as performanceRubricsViewEdit.html — an unscoped local <style>
   block used bare `table`, `th, td`, `button`, `h1, h2, h3`, and (worst of all) a bare
   `.tab-content{display:none}` rule that would have hidden every Bootstrap-style
   tab-content pane on the whole TrainingProgramDetails page, not just this one. Scoped
   under .puc-view / .puc-outer to fix that. Table chrome now comes from .lst-grid instead
   of bare table/th/td rules that used to fight with the shared listing styles. */
.puc-outer { float: none !important; }
.puc-view.container { max-width: 100%; width: 100%; box-sizing: border-box; }
.puc-header__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 700; color: #0f172a; }
.puc-header__title i { color: #6366f1; }
.puc-view .metric-section { margin-bottom: 24px; }
.puc-scroll { overflow-x: auto; }
.puc-input {
    width: 90%;
    padding: 7px 10px;
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    font-size: 13px;
    color: #1e293b;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.puc-input:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.puc-view .month-header { background-color: #eef2ff !important; text-align: center; }
.puc-view .employee-id { font-weight: 700; color: #0f172a; }
.puc-view .button-container { display: flex; justify-content: flex-end; margin-top: 20px; gap: 10px; }
.puc-view .title-container { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; flex-wrap: wrap; }
.puc-view .action-buttons { display: flex; gap: 10px; flex-wrap: wrap; }
.puc-view .instructions {
    background-color: #eef2ff;
    border-left: 4px solid #6366f1;
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 0 8px 8px 0;
    color: #334155;
}

/* ── Marketing tab / Leads (marketing-leads.html) ──────────────────────────── */
.ml-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.ml-lead-card {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
}
.ml-lead-card .h4objective { display: flex; align-items: center; gap: 6px; }
.ml-grid-panel { margin-bottom: 16px; }
.ml-grid { width: 100%; }

/* ── Marketing tab / Landing Page (marketing-landingpage.html) ────────────── */
.mlp-view {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    padding: 20px;
}
.mlp-layout { display: flex; flex-direction: column; gap: 20px; }
@media (min-width: 768px) {
    .mlp-layout { flex-direction: row; align-items: flex-start; }
}
.mlp-sidebar {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    padding: 10px;
    flex: 0 0 auto;
}
@media (min-width: 768px) {
    .mlp-sidebar { flex: 0 0 220px; width: 220px; position: sticky; top: 12px; }
}
.mlp-content { flex: 1 1 auto; min-width: 0; }

.mlp-view .selectedTemplateBorder .mlp-template-thumb {
    outline: 3px solid #6366f1;
    outline-offset: 2px;
}
.mlp-side-tabs {
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-bottom: none !important;
}
@media (max-width: 767px) {
    .mlp-side-tabs { flex-direction: row; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .mlp-side-tabs > li { flex: 0 0 auto; }
}
.mlp-side-tabs > li { float: none; }
.mlp-side-tabs > li > a {
    border: 1px solid #e6e6e6 !important;
    border-radius: 8px !important;
    color: #64748b;
    font-weight: 600;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: transparent;
    white-space: nowrap;
}
.mlp-side-tabs > li > a i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 6px;
    color: #b0bec5;
    font-size: 12px;
    transition: background .15s ease, color .15s ease;
}
.mlp-side-tabs > li > a:hover { background: #f1f5f9; color: #1e293b; }
.mlp-side-tabs > li > a:hover i { color: #7c3aed; }
.mlp-side-tabs > li.active > a,
.mlp-side-tabs > li.active > a:hover,
.mlp-side-tabs > li.active > a:focus {
        background: #eef2ff !important;
    color: #6366f1 !important;
    border: 1px solid #6366f1 !important;
}
.mlp-side-tabs > li.active > a i { background: #6366f1; color: #fff; }
.mlp-new-template-panel {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    padding: 14px;
    margin-top: 12px;
}
.mlp-new-template-title { font-weight: 600; font-size: 13px; margin: 0 0 12px; color: #1e293b; }
.mlp-pane-header {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eef2f7;
}
.mlp-pane-header i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #eef2ff;
    color: #6366f1;
    font-size: 14px;
    flex-shrink: 0;
}
.mlp-toolbar { display: flex; justify-content: flex-end; margin-bottom: 16px; }
.mlp-inline-actions { display: flex; gap: 8px; margin-top: 8px; }
.mlp-view .hiw {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #6366f1;
    text-transform: uppercase;
    letter-spacing: .03em;
    border-bottom: none;
    margin: 20px 0 10px;
}
.mlp-view .panel-body.panel-shadw {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.mlp-view .faq_panel {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    margin-bottom: 10px;
    overflow: hidden;
}
.mlp-view .faq_panel .panel-heading.question-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    cursor: pointer;
    background: #fff;
    border: none;
}
.mlp-view .faq_panel .panel-heading.question-toggle i.fa-angle-right {
    color: #6366f1;
    transition: transform .2s ease;
    flex-shrink: 0;
}
.mlp-view .faq_panel .panel-heading.question-toggle:not(.collapsed) i.fa-angle-right {
    transform: rotate(90deg);
}
.mlp-view .faq_panel .panel-title { margin: 0; font-size: 14px; font-weight: 600; color: #1e293b; flex: 1; }
.mlp-view .faq_panel .pullright { margin-left: auto; }
.mlp-view .faq_panel .panel-body { padding: 0 16px 16px 42px; color: #475569; font-size: 13px; line-height: 1.6; }
.mlp-copy-field { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; }
.mlp-copy-field .form-control {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 13px;
    color: #475569;
    flex: 1 1 240px;
}
.mlp-delete-preview {
    margin: 0;
    padding: 10px 12px;
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-left: 3px solid #ef4444;
    border-radius: 6px;
    font-size: 13px;
    color: #334155;
    font-style: italic;
}
.mlp-toggle {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 4px;
    background: #f1f5f9;
    border-radius: 10px;
}
.mlp-toggle__option {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.mlp-toggle__option i { font-size: 12px; color: #94a3b8; transition: color .15s ease; }
.mlp-toggle__option:hover { color: #1e293b; }
.mlp-toggle__option--active { background: #fff; color: #6366f1; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08); }
.mlp-toggle__option--active i { color: #6366f1; }
.mlp-toggle__input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }

.mlp-content-picker {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    max-height: 320px;
    overflow-y: auto;
    background: #fff;
}
.mlp-content-picker__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    margin: 0;
    font-weight: normal;
    cursor: pointer;
    border-bottom: 1px solid #f1f5f9;
    transition: background .15s ease;
}
.mlp-content-picker__item:last-child { border-bottom: none; }
.mlp-content-picker__item:hover { background: #f8fafc; }
.mlp-content-picker__item--checked,
.mlp-content-picker__item--checked:hover { background: #eef2ff; }
.mlp-content-picker__checkbox {
    margin: 3px 0 0;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    accent-color: #6366f1;
    cursor: pointer;
}
.mlp-content-picker__body { flex: 1; min-width: 0; font-size: 13px; color: #334155; line-height: 1.6; }
.mlp-content-picker__body :first-child { margin-top: 0; }
.mlp-content-picker__body :last-child { margin-bottom: 0; }
.mlp-content-picker__question { display: block; font-weight: 600; color: #1e293b; margin-bottom: 2px; }
.mlp-content-picker__answer { display: block; color: #64748b; font-size: 12px; line-height: 1.5; }
.mlp-template-grid { display: flex; flex-wrap: wrap; gap: 16px; margin: 0; padding: 0; }
.mlp-template-grid > li {
    list-style: none;
    width: 220px;
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    padding: 10px;
    position: relative;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: box-shadow .15s ease, transform .15s ease;
}
.mlp-template-grid > li:hover { box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08); transform: translateY(-2px); }
.mlp-template-grid input.checkmark { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.mlp-template-thumb { height: 130px; border: 1px solid #eef2f7; border-radius: 8px; width: 100%; object-fit: cover; display: block; }
.mlp-template-actions { justify-content: center; gap: 8px; margin-top: 8px; }

/* ── Marketing tab / Announcements (marketing-announcements.html) ─────────── */
.ma-view {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.04);
    padding: 20px;
}
.ma-layout { display: flex; flex-direction: column; gap: 20px; }
@media (min-width: 768px) {
    .ma-layout { flex-direction: row; align-items: flex-start; }
}
.ma-form-panel {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    padding: 16px;
    flex: 0 0 auto;
}
@media (min-width: 768px) {
    .ma-form-panel { flex: 0 0 360px; width: 360px; }
}
.ma-list-panel { flex: 1 1 auto; min-width: 0; }
.ma-panel-header {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eef2f7;
}
.ma-panel-header i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: #eef2ff;
    color: #6366f1;
    font-size: 13px;
    flex-shrink: 0;
}
.ma-scroller { max-height: 480px; overflow-y: auto; padding-right: 4px; }
.ma-item {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    padding: 14px 16px;
    margin-bottom: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.ma-item:last-child { margin-bottom: 0; }
.ma-item__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.ma-item__title { margin: 0; font-size: 14px; font-weight: 700; color: #1e293b; }
.ma-item__meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.ma-item__body { margin: 0; font-size: 13px; color: #475569; line-height: 1.6; }
.ma-delete-preview {
    margin: 0;
    padding: 10px 12px;
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-left: 3px solid #ef4444;
    border-radius: 6px;
    font-size: 13px;
    color: #334155;
    font-style: italic;
}

/* ── Reports tab / Customer Purchase report (report-CustomerPurchase.html) ── */
.rcp-toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-bottom: 16px; }
.rcp-toolbar__field { min-width: 200px; }
.rcp-grid { width: 100%; }
.rcp-cert-link-wrap { width: 100%; }

/* NOTE: this local <style> block used to be unscoped, with a bare `.modal-footer{display:flex;
   justify-content:center}` rule that would have re-centered every modal footer on the whole
   TrainingProgramDetails page, and a bare `.close i{top:unset!important}` rule affecting every
   modal close-icon app-wide. Scoped under .rcp-trainee-view. The other class names here
   (linkContainer, certLink, copyBtnnew, modHead, qrImg, etc.) are specific/bespoke enough that
   they're left as-is, just prefixed for safety, since this Program-Certificate QR modal already
   has deliberate custom styling worth preserving rather than replacing with the generic mv-modal. */
.rcp-trainee-view #certificatTempletes {
    width: 100%;
    display: flex;
    flex-direction: column-reverse;
    gap: 12px;
    align-items: center;
    padding: 0 30px;
}
.rcp-trainee-view .linkContainer {
    display: flex;
    gap: 0px;
    width: auto;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.075);
    border: 2px solid #229dcc;
}
.rcp-trainee-view .modal-footer { display: flex; justify-content: center; }
.rcp-trainee-view .certLink { width: 100%; padding: 10px 10px; border: none; height: fit-content; font-size: 13px;}
.rcp-trainee-view .copyBtnnew {
    font-family: system-ui;
    flex-shrink: 0;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 500;
    border-radius: 0;
}
.rcp-trainee-view .copyBtnnew2 {
    font-family: system-ui;
    flex-shrink: 0;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 500;
    border-radius: 6px;
    width: 100%;
}
.rcp-trainee-view .modHead {
    align-items: center;
    font-size: 20px;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    color: #3e3e3e;
    font-weight: 600;
    font-family: system-ui;
    padding: 13px 30px;
    border-bottom: 1px solid #e6e6e6 !important;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    margin: 0 0 20px 0;
}
.rcp-trainee-view .close i { top: unset !important; }
.rcp-trainee-view .qrImg {
    height: 150px;
    width: 150px;
    border: 1px solid #dbdbdb;
    padding: 7px;
    border-radius: 5px;
    box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.075);
    object-fit: contain;
}
.rcp-trainee-view .modFoot {
    margin: 30px 0 0 0;
    border-top: 1px solid #e6e6e6 !important;
    padding: 10px 30px !important;
    justify-content: flex-end;
}
.rcp-trainee-view .closeBtnnew {
    font-family: system-ui;
    font-size: 15px !important;
    font-weight: 600;
    background: #f8f8f8;
    border: 2px solid #eaebff;
    text-transform: uppercase;
    padding: 10px 20px;
    border-radius: 7px;
}
.rcp-trainee-view .closeBtnnew:focus,
.rcp-trainee-view .copyBtnnew:focus { outline: none !important; }
.rcp-trainee-view .signUpLink {
    font-size: 20px;
    margin: 0;
    color: #3e3e3e;
    font-family: system-ui;
    font-weight: 500;
    padding: 0 0 5px 0;
}
.rcp-trainee-view .flexpart2 {
    width: auto;
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
    justify-content: center;
}
.rcp-trainee-view .ui-grid { width: 100%; }
.rcp-trainee-view .actions-column,
.rcp-trainee-view .actions-column .ui-grid-cell-contents,
.rcp-trainee-view .actions-column .btn { white-space: nowrap !important; }
.rcp-trainee-view .hide-pagination .ui-grid-pager-panel { display: none; }

/* ── Reports tab / Training Impact Dashboard (trainingImpactDashboard.html) ──── */
/* NOTE: this file had two local <style> blocks. The first was unscoped with bare
   `h1,h2,h3`, `select,button`, `table`, `th,td`, and `body` (in @media print) selectors
   that would have leaked to the rest of the TrainingProgramDetails page. Scoped under
   .tid-view. This whole dashboard is a static UI prototype (hardcoded demo data, not
   ng-repeat/API driven) — canvas ids and .tab/.participant-chip classes are read directly
   by document.getElementById/querySelectorAll in trainingImpactDashboardController.js and
   were preserved exactly. */
.tid-view .container {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
}
.tid-view h1, .tid-view h2, .tid-view h3 { margin-top: 0; color: #333; }
.tid-view .dashboard-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eaeaea;
}
.tid-view .controls { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.tid-period-select { width: auto; display: inline-block; }
.tid-view .metrics-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
.tid-view .assumptions {
    background-color: #f9f9f9;
    border-left: 4px solid #ff9800;
    padding: 15px;
    margin: 20px 0;
    border-radius: 0 4px 4px 0;
}
.tid-view .assumptions h3 { margin-top: 0; color: #ff9800; }
.tid-view .assumptions ul { margin-bottom: 0; padding-left: 20px; }
.tid-view .metric-section {
    margin-bottom: 30px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}
.tid-view .metric-header {
    background-color: #f2f2f2;
    padding: 12px 15px;
    font-weight: bold;
    border-bottom: 1px solid #ddd;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.tid-view .metric-weight { font-size: 14px; color: #666; font-weight: normal; }
.tid-view table { width: 100%; border-collapse: collapse; }
.tid-view th, .tid-view td { border: 1px solid #ddd; padding: 10px; text-align: left; }
.tid-view th { background-color: #f8f8f8; font-weight: 600; }
.tid-view .month-header { background-color: #e6f7ff; text-align: center; }
.tid-view .participant-row { background-color: #fafafa; }
.tid-view .change-positive { color: #4caf50; font-weight: bold; }
.tid-view .change-negative { color: #f44336; font-weight: bold; }
.tid-view .change-neutral { color: #ff9800; font-weight: bold; }
.tid-view .summary-card { background-color: #f9f9f9; border-radius: 8px; padding: 15px; margin-bottom: 20px; }
.tid-view .summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
    margin-top: 15px;
}
.tid-view .summary-item { background-color: #fff; border-radius: 6px; padding: 15px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
.tid-view .summary-title { font-size: 14px; color: #666; margin-bottom: 5px; }
.tid-view .summary-value { font-size: 24px; font-weight: bold; color: #333; }
.tid-view .summary-change { margin-top: 5px; font-size: 14px; }
.tid-view .highlights { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 15px; margin-bottom: 20px; }
.tid-view .highlight-card { flex: 1 1 220px; background-color: #fff; border-radius: 8px; padding: 15px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
.tid-view .highlight-header { font-weight: bold; margin-bottom: 10px; color: #1976d2; }
.tid-view .highlight-content { font-size: 14px; }
.tid-view .participant-filter { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 15px; }
.tid-view .filter-chip { padding: 5px 10px; background-color: #e0e0e0; border-radius: 15px; font-size: 14px; cursor: pointer; }
.tid-view .filter-chip.active { background-color: #1976d2; color: #fff; }
.tid-view .profile-img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 8px;
    background-color: #ddd;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #555;
}
.tid-view .employee-name { display: flex; align-items: center; }
.tid-view .chart-container { height: 200px; margin-top: 20px; }
.tid-view .trend-positive { color: #4caf50; }
.tid-view .trend-negative { color: #f44336; }
@media print {
    .tid-view .container { box-shadow: none; max-width: 100%; }
    .tid-view .controls, .tid-view .participant-filter { display: none; }
}
/* ── end CourseWidget ────────────────────────────────────────────────────────── */
/* -- Reports tab / Training Impact Dashboard, graphical view (trainingImpactDashboard.html) --
   NOTE: originally an unscoped local <style> block with %.grid/.card/.controls/.chart-container
   class names that collide with Style Block 1's own (differently-scoped) rules for the
   table view, since both views share the .tid-view ancestor and ng-show does not remove them
   from the DOM. CSS custom properties moved off :root onto .tid-graphical-view so they do not
   leak page-wide. */
                .tid-graphical-view {
                    --primary: #1976d2;
                    --primary-light: #e3f2fd;
                    --success: #4caf50;
                    --success-light: #e8f5e9;
                    --warning: #ff9800;
                    --warning-light: #fff3e0;
                    --danger: #f44336;
                    --danger-light: #ffebee;
                    --info: #00bcd4;
                    --info-light: #e0f7fa;
                    --purple: #9c27b0;
                    --purple-light: #f3e5f5;
                    --grey: #757575;
                    --grey-light: #f5f5f5;
                    --dark: #333333;
                }


                .tid-graphical-view .dashboard {
                    max-width: 1400px;
                    margin: 0 auto;
                    padding: 20px;
                }

                .tid-graphical-view .header {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    margin-bottom: 20px;
                    padding-bottom: 10px;
                    border-bottom: 1px solid #e0e0e0;
                }

                .tid-graphical-view .title h1 {
                    font-size: 24px;
                    font-weight: 600;
                    color: var(--dark);
                }

                .tid-graphical-view .subtitle {
                    font-size: 14px;
                    color: var(--grey);
                    margin-top: 5px;
                }

                .tid-graphical-view .controls {
                    display: flex;
                    gap: 10px;
                }

                .tid-graphical-view .control-btn {
                    background-color: #fff;
                    border: 1px solid #e0e0e0;
                    border-radius: 6px;
                    padding: 8px 15px;
                    font-size: 14px;
                    cursor: pointer;
                    display: flex;
                    align-items: center;
                    gap: 5px;
                    transition: all 0.2s;
                }

                    .tid-graphical-view .control-btn:hover {
                        border-color: var(--primary);
                        color: var(--primary);
                    }

                    .tid-graphical-view .control-btn.active {
                        background-color: var(--primary);
                        color: white;
                        border-color: var(--primary);
                    }

                .tid-graphical-view .grid {
                    display: grid;
                    grid-template-columns: repeat(12, 1fr);
                    gap: 20px;
                }

                .tid-graphical-view .card {
                    background-color: white;
                    border-radius: 10px;
                    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
                    padding: 20px;
                    transition: all 0.3s;
                }

                    .tid-graphical-view .card:hover {
                        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
                        transform: translateY(-2px);
                    }

                .tid-graphical-view .card-header {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    margin-bottom: 15px;
                }

                .tid-graphical-view .card-title {
                    font-size: 16px;
                    font-weight: 600;
                    color: var(--dark);
                }

                .tid-graphical-view .card-subtitle {
                    font-size: 12px;
                    color: var(--grey);
                    margin-top: 5px;
                }

                .tid-graphical-view .card-action {
                    font-size: 13px;
                    color: var(--primary);
                    cursor: pointer;
                }

                .tid-graphical-view .col-3 {
                    grid-column: span 3;
                }

                .tid-graphical-view .col-4 {
                    grid-column: span 4;
                }

                .tid-graphical-view .col-6 {
                    grid-column: span 6;
                }

                .tid-graphical-view .col-8 {
                    grid-column: span 8;
                }

                .tid-graphical-view .col-12 {
                    grid-column: span 12;
                }

                .tid-graphical-view .row-1 {
                    grid-row: span 1;
                }

                .tid-graphical-view .row-2 {
                    grid-row: span 2;
                }

                .tid-graphical-view .metric-card {
                    text-align: center;
                    padding: 15px;
                }

                .tid-graphical-view .metric-value {
                    font-size: 36px;
                    font-weight: 700;
                    color: var(--primary);
                    margin: 10px 0;
                }

                .tid-graphical-view .metric-label {
                    font-size: 14px;
                    color: var(--grey);
                    margin-bottom: 5px;
                }

                .tid-graphical-view .metric-change {
                    font-size: 13px;
                    font-weight: 500;
                    display: inline-block;
                    padding: 3px 6px;
                    border-radius: 20px;
                }

                .tid-graphical-view .positive {
                    color: var(--success);
                    background-color: var(--success-light);
                }

                .tid-graphical-view .negative {
                    color: var(--danger);
                    background-color: var(--danger-light);
                }

                .tid-graphical-view .neutral {
                    color: var(--warning);
                    background-color: var(--warning-light);
                }

                .tid-graphical-view .tabs {
                    display: flex;
                    border-bottom: 1px solid #e0e0e0;
                    margin-bottom: 15px;
                }

                .tid-graphical-view .tab {
                    padding: 10px 15px;
                    font-size: 14px;
                    cursor: pointer;
                    position: relative;
                    color: var(--grey);
                }

                    .tid-graphical-view .tab.active {
                        color: var(--primary);
                        font-weight: 500;
                    }

                        .tid-graphical-view .tab.active::after {
                            content: '';
                            position: absolute;
                            left: 0;
                            bottom: -1px;
                            width: 100%;
                            height: 2px;
                            background-color: var(--primary);
                        }

                .tid-graphical-view .chart-container {
                    position: relative;
                    height: 250px;
                    width: 100%;
                }

                .tid-graphical-view .leaderboard {
                    list-style: none;
                }

                .tid-graphical-view .leaderboard-item {
                    display: flex;
                    align-items: center;
                    padding: 10px 0;
                    border-bottom: 1px solid #f0f0f0;
                }

                .tid-graphical-view .rank {
                    font-size: 16px;
                    font-weight: 600;
                    color: var(--grey);
                    width: 30px;
                }

                .tid-graphical-view .avatar {
                    width: 36px;
                    height: 36px;
                    border-radius: 50%;
                    background-color: var(--primary-light);
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-right: 10px;
                    color: var(--primary);
                    font-weight: 600;
                }

                .tid-graphical-view .participant-info {
                    flex: 1;
                }

                .tid-graphical-view .participant-name {
                    font-size: 14px;
                    font-weight: 500;
                }

                .tid-graphical-view .participant-details {
                    font-size: 12px;
                    color: var(--grey);
                }

                .tid-graphical-view .score {
                    font-size: 16px;
                    font-weight: 700;
                    color: var(--primary);
                }

                .tid-graphical-view .progress-bar {
                    background-color: #f0f0f0;
                    border-radius: 4px;
                    height: 6px;
                    margin-top: 5px;
                    overflow: hidden;
                }

                .tid-graphical-view .progress-fill {
                    height: 100%;
                    background-color: var(--primary);
                }

                .tid-graphical-view .badge {
                    font-size: 11px;
                    padding: 2px 8px;
                    border-radius: 20px;
                    font-weight: 500;
                    margin-left: 8px;
                }

                .tid-graphical-view .badge-primary {
                    background-color: var(--primary-light);
                    color: var(--primary);
                }

                .tid-graphical-view .badge-success {
                    background-color: var(--success-light);
                    color: var(--success);
                }

                .tid-graphical-view .badge-warning {
                    background-color: var(--warning-light);
                    color: var(--warning);
                }

                .tid-graphical-view .badge-info {
                    background-color: var(--info-light);
                    color: var(--info);
                }

                .tid-graphical-view .badge-purple {
                    background-color: var(--purple-light);
                    color: var(--purple);
                }

                .tid-graphical-view .heatmap {
                    display: grid;
                    grid-template-columns: repeat(7, 1fr);
                    gap: 5px;
                    margin-top: 15px;
                }

                .tid-graphical-view .heatmap-cell {
                    height: 30px;
                    border-radius: 4px;
                    position: relative;
                }

                    .tid-graphical-view .heatmap-cell:hover::after {
                        content: attr(data-value);
                        position: absolute;
                        top: -30px;
                        left: 50%;
                        transform: translateX(-50%);
                        background-color: #333;
                        color: white;
                        font-size: 12px;
                        padding: 3px 6px;
                        border-radius: 4px;
                        white-space: nowrap;
                    }

                .tid-graphical-view .legend {
                    display: flex;
                    justify-content: center;
                    margin-top: 10px;
                    gap: 10px;
                }

                .tid-graphical-view .legend-item {
                    display: flex;
                    align-items: center;
                    font-size: 12px;
                    color: var(--grey);
                }

                .tid-graphical-view .legend-color {
                    width: 12px;
                    height: 12px;
                    border-radius: 2px;
                    margin-right: 5px;
                }

                .tid-graphical-view .category-scores {
                    display: flex;
                    flex-wrap: wrap;
                    gap: 10px;
                    margin-top: 15px;
                }

                .tid-graphical-view .category-score {
                    flex: 1;
                    min-width: 80px;
                    background-color: var(--grey-light);
                    border-radius: 6px;
                    padding: 10px;
                    text-align: center;
                }

                .tid-graphical-view .category-name {
                    font-size: 12px;
                    color: var(--grey);
                    margin-bottom: 5px;
                }

                .tid-graphical-view .category-value {
                    font-size: 16px;
                    font-weight: 600;
                    color: var(--dark);
                }

                .tid-graphical-view .insights {
                    margin-top: 15px;
                }

                .tid-graphical-view .insight-item {
                    display: flex;
                    gap: 10px;
                    margin-bottom: 10px;
                    padding-bottom: 10px;
                    border-bottom: 1px solid #f0f0f0;
                }

                .tid-graphical-view .insight-icon {
                    width: 24px;
                    height: 24px;
                    background-color: var(--primary-light);
                    border-radius: 50%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    color: var(--primary);
                    font-size: 12px;
                }

                .tid-graphical-view .insight-content {
                    flex: 1;
                    font-size: 13px;
                }

                .tid-graphical-view .correlation-grid {
                    display: grid;
                    grid-template-columns: repeat(4, 1fr);
                    gap: 10px;
                    margin-top: 15px;
                }

                .tid-graphical-view .correlation-item {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    text-align: center;
                    padding: 10px;
                    background-color: var(--grey-light);
                    border-radius: 6px;
                }

                .tid-graphical-view .correlation-value {
                    font-size: 18px;
                    font-weight: 600;
                    color: var(--primary);
                    margin: 5px 0;
                }

                .tid-graphical-view .correlation-label {
                    font-size: 12px;
                    color: var(--grey);
                }

                .tid-graphical-view .gauge-container {
                    position: relative;
                    width: 120px;
                    height: 120px;
                    margin: 0 auto;
                }

                .tid-graphical-view .gauge-bg {
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    border-radius: 50%;
                    background-color: #f0f0f0;
                    clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 0% 100%, 0% 0%, 50% 0%);
                }

                .tid-graphical-view .gauge-fill {
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    border-radius: 50%;
                    background-color: var(--primary);
                    clip-path: polygon(50% 0%, 100% 0%, 100% 50%, 50% 50%);
                    transform-origin: center center;
                }

                .tid-graphical-view .gauge-center {
                    position: absolute;
                    width: 80px;
                    height: 80px;
                    top: 20px;
                    left: 20px;
                    border-radius: 50%;
                    background-color: white;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    font-size: 24px;
                    font-weight: 700;
                    color: var(--primary);
                }

                .tid-graphical-view .participant-filter {
                    display: flex;
                    gap: 10px;
                    margin-top: 20px;
                    overflow-x: auto;
                    padding-bottom: 10px;
                }

                .tid-graphical-view .participant-chip {
                    padding: 6px 12px;
                    border-radius: 20px;
                    font-size: 13px;
                    cursor: pointer;
                    background-color: white;
                    border: 1px solid #e0e0e0;
                    white-space: nowrap;
                }

                    .tid-graphical-view .participant-chip.active {
                        background-color: var(--primary);
                        color: white;
                        border-color: var(--primary);
                    }

                .tid-graphical-view .filter-section {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    padding: 10px 0;
                    margin-bottom: 20px;
                }

                .tid-graphical-view .filter-label {
                    font-size: 14px;
                    font-weight: 500;
                    color: var(--dark);
                }

                .tid-graphical-view .filter-options {
                    display: flex;
                    gap: 10px;
                }

                .tid-graphical-view .export-btn {
                    background-color: var(--primary);
                    color: white;
                    border: none;
                    border-radius: 6px;
                    padding: 8px 15px;
                    font-size: 14px;
                    cursor: pointer;
                    display: flex;
                    align-items: center;
                    gap: 5px;
                }

                @media (max-width: 1200px) {
                    .tid-graphical-view .col-3, .tid-graphical-view .col-4, .tid-graphical-view .col-6 {
                        grid-column: span 6;
                    }
                }

                @media (max-width: 768px) {
                    .tid-graphical-view .col-3, .tid-graphical-view .col-4, .tid-graphical-view .col-6, .tid-graphical-view .col-8, .tid-graphical-view .col-12 {
                        grid-column: span 12;
                    }

                    .tid-graphical-view .grid {
                        gap: 15px;
                    }

                    .tid-graphical-view .dashboard {
                        padding: 15px;
                    }

                    .tid-graphical-view .metric-value {
                        font-size: 28px;
                    }
                }

.tid-roi-grid { margin-top: 15px; }
.tid-roi-label { text-align: center; margin-top: 10px; font-size: 14px; }

/* ── Reports tab / Student Feedback Report (report-studentFeedback.html) ──── */
.rsf-grid { width: 100%; }

/* ── Reports tab / Practical Training Report (report-ReproDevice_practTraningReport.html) ── */
/* NOTE: this file previously wrapped its content in a full <!DOCTYPE html><html><head>...
   <body> document instead of a plain fragment, even though it's an Angular templateUrl
   partial injected into the existing page. Stripped down to a fragment. Its .ui-grid-cell-
   contents override was also unscoped (would have applied a 240px max-width to every
   ui-grid cell app-wide) — scoped under .rrd-view. */
.rrd-grid { width: 100%; }
.rrd-view .addCursor { cursor: pointer; }
.rrd-view .ui-grid-cell-contents { max-width: 230px; }

/* ── Communication tab / Emails (Communication-Emails.html) ───────────────── */
.ce-toolbar { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 16px; }
.ce-batch-info { padding: 5px; }
.ce-batch-info__name { font-weight: bold; }
.ce-batch-info__dates { margin-left: 5px; }
.ce-recipients-block { margin-top: 10px; }
.ce-resolve-link { color: #2563eb; border-bottom: 2px solid #ef4444; }
.ce-list-toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.ce-checkbox-col { width: 50px; }
.ce-tab-external-icon { font-size: 10px; margin-left: 4px; opacity: .7; }
.ce-header { display: flex; align-items: center; margin-bottom: 16px; }
.ce-header__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; font-weight: 700; color: #0f172a; }
.ce-header__title i { color: #6366f1; }
.ce-radio-group { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0 20px; }
.ce-radio-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: 1.5px solid #e2e8f0;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    cursor: pointer;
    background: #fff;
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.ce-radio-chip input[type="radio"] { margin: 0; accent-color: #6366f1; }
.ce-radio-chip:hover { border-color: #c7d2fe; background: #f8fafc; }
.ce-radio-chip:has(input:checked) { border-color: #6366f1; background: #eef2ff; color: #4338ca; font-weight: 700; }
.ce-radio-chip { align-items: center; }


/* Schedule Email modal — fixed footer nav (outside the scrollable .mv-modal__body,
   so Prev/Next are always visible instead of scrolling off with the step content) */
.ce-wizard-footer {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 22px;
    border-top: 1px solid #eef2f7;
    background: #fff;
    flex-shrink: 0;
}
.ce-wizard-footer__spacer { flex: 1; }
.ce-wizard-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 20px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.ce-wizard-btn--prev { color: #64748b; background: #f1f5f9; }
.ce-wizard-btn--prev:hover { background: #e2e8f0; color: #1e293b; }
.ce-wizard-btn--next {
    color: #fff !important;
    background: linear-gradient(135deg, #6366f1, #4f46e5);
    box-shadow: 0 2px 8px rgba(99, 102, 241, .35);
}
.ce-wizard-btn--next:hover { box-shadow: 0 6px 18px rgba(99, 102, 241, .45); }

.editDatediv {
    display: flex;
    gap: 5px;
    color: #000;
        align-items: start;
    flex-direction: column;
}

.editDatediv h6 {
    font-weight: 500 !important;
    font-size: 14px !important;
    margin: 0;
}
.editDatediv button {
    background: #2196f3;
    border: none;
    padding: 5px 10px;
    font-size: 13px;
    color: #fff;
    border-radius: 5px;
}

/* ── Learners tab / Student List — export table & fixes found in final inline-style sweep ── */
.lrn-export-table { display: none; }
.lrn-export-hidden { display: none; }
.lrn-learner-details-col { width: 18%; }

/* ── Performance tab / Assessment — Survey card row fix found in final inline-style sweep ── */
.assess-survey-row { display: flex; flex-wrap: wrap; }

/* ══════════════════════════════════════════════════════════════════════════
   jad-* — JobPosting/JobApplicantData (applicant tracking detail page)
   ══════════════════════════════════════════════════════════════════════════ */

/* extra mc-badge colour modifiers used by the status funnel */
.mc-badge--warning{background:#fef3c7;color:#b45309}
.mc-badge--warning svg{
    height: 14px;
    width: 14px;
}
.mc-badge--purple{background:#ede9fe;color:#6d28d9}
.mc-badge--slate{background:#f1f5f9;color:#475569}

/* ── jad-body-grid — 3-column layout that stacks on tablet/mobile ───────── */
/* the element also carries the shared "flex-wrap" utility class (wrap) —
   override it to nowrap so the row is never allowed to break; items shrink
   via flex-shrink instead. Mobile stacking still works via flex-direction:
   column below, where wrap direction is irrelevant. */
.jad-body-grid{gap:8px;flex-wrap:nowrap!important; justify-content: space-between;}
/* flex items default to min-width:auto, which lets their content's intrinsic
   min-size (e.g. a nowrap table cell) block shrinking and force a wrap even
   when the percentage widths + gap fit the row. min-width:0 + border-box
   (so any inner padding is counted inside the percentage, not added on top)
   is the standard fix. Scoped to this grid only — the shared .bs-sm:w-*
   utilities are unaffected elsewhere in the app. */
.jad-body-grid > [class*="bs-sm:w-"]{min-width:0;box-sizing:border-box}
.jad-body-grid > .bs-sm\:w-3\/12{width:26%}
.jad-body-grid > .bs-sm\:w-4\/12{width:29%}
@media(max-width:1023px){
    .jad-body-grid{flex-direction:column}
    .jad-body-grid > [class*="bs-sm:w-"]{width:100% !important}
}

/* ── jad-job-banner — job title / meta / description card ───────────────── */
.jad-job-banner{background:#fff;border-radius:14px;border:1px solid #e2e8f0;box-shadow:0 2px 12px rgba(0,0,0,.06);padding:20px 24px;margin-bottom:16px;border-top:3px solid #6366f1}
.jad-job-banner__top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.jad-job-banner__title-group{display:flex;flex-direction:column;gap:10px;min-width:0}
.jad-job-banner__title{font-size:19px;font-weight:700;color:#1e293b;margin:0;line-height:1.3}
.jad-job-banner__chips{display:flex;flex-wrap:wrap;gap:6px}
.jad-job-banner__actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.jad-job-banner__body{margin-top:16px;padding-top:16px;border-top:1px solid #f1f5f9;display:flex;flex-direction:column;gap:10px}
.jad-job-banner__desc{font-size:13px;color:#475569;line-height:1.7;margin:0}
.jad-job-banner__location{font-size:12.5px;color:#64748b;display:flex;align-items:center;gap:6px}
.jad-job-banner__location i{color:#6366f1}
.jad-job-banner__skills{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}

/* ── jad-funnel — clickable status filter row ────────────────────────────── */
.jad-funnel{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.jad-funnel__item{flex:1 1 130px;min-width:110px;background:#fff;border:1px solid #e2e8f0;border-top:3px solid transparent;border-radius:12px;padding:12px 14px;text-align:center;cursor:pointer;transition:background .15s,box-shadow .15s,transform .15s;min-height:44px}
.jad-funnel__item:hover{box-shadow:0 4px 14px rgba(15,23,42,.08);transform:translateY(-1px)}
.jad-funnel__count{display:block;font-size:22px;font-weight:800;color:#1e293b;line-height:1.2}
.jad-funnel__label{display:flex;align-items:center;justify-content:center;gap:5px;font-size:11.5px;font-weight:600;color:#64748b;margin-top:3px;text-transform:uppercase;letter-spacing:.03em}
.jad-funnel__item--applied{border-top-color:#2563eb}
.jad-funnel__item--shortlisted{border-top-color:#d97706}
.jad-funnel__item--interview{border-top-color:#7c3aed}
.jad-funnel__item--rejected{border-top-color:#dc2626}
.jad-funnel__item--selected{border-top-color:#059669}
.jad-funnel__item--notattend{border-top-color:#64748b}
.jad-funnel__item--active{background:#eef2ff;box-shadow:0 4px 14px rgba(99,102,241,.15)}
.jad-funnel__item--active .jad-funnel__count{color:#6366f1}
.jad-funnel__item--active .jad-funnel__label{color:#4f46e5}

/* ── jad-candidate-list — left column list of applicants ─────────────────── */
.jad-candidate-list{list-style:none;margin:0;padding:0;max-height:560px;overflow-y:auto}
.jad-candidate-list__item{display:flex;gap:10px;padding:12px 16px;border-bottom:1px solid #f1f5f9;cursor:pointer;transition:background .15s;border-left:3px solid transparent;min-height:44px}
.jad-candidate-list__item:hover{background:#f8fafc}
.jad-candidate-list__item--active,.jad-candidate-list__item--active:hover{background:#eef2ff;border-left-color:#6366f1;box-shadow:inset 0 0 0 1px rgba(99,102,241,.16)}
.jad-candidate-list__item--active .jad-candidate-list__name{color:#4338ca}
.jad-candidate-list__item--active .jad-candidate-list__avatar{box-shadow:0 0 0 2px #6366f1}
.jad-candidate-list__avatar{width:44px;height:44px;border-radius:50% !important;object-fit:cover;flex-shrink:0;border:2px solid #fff;box-shadow:0 0 0 1px #e2e8f0}
.jad-candidate-list__body{min-width:0;flex:1}
.jad-candidate-list__name{font-size:13.5px;font-weight:700;color:#1e293b;margin:0 0 2px;line-height:1.3}
.jad-candidate-list__resume{font-size:12px;color:#64748b;margin:0 0 4px;line-height:1.4}
.jad-candidate-list__resume--muted{font-style:italic;color:#94a3b8}
.jad-candidate-list__meta{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
.jad-candidate-list__applied{font-size:11px;color:#94a3b8;display:inline-flex;align-items:center;gap:4px}
.jad-candidate-list__empty{padding:24px 16px;text-align:center;font-size:12.5px;color:#94a3b8}
.jad-chip--online{color:#15803d;border-color:rgba(74,222,128,.4);background:#f0fdf4}
.jad-chip--online i{color:#16a34a;font-size:8px}
.jad-chip--offline{color:#94a3b8}
.jad-chip--offline i{color:#cbd5e1;font-size:8px}

/* ── jad-profile-card — selected candidate's profile ─────────────────────── */
.jad-profile-card{background:#fff;border-radius:14px;border:1px solid #e2e8f0;box-shadow:0 2px 12px rgba(0,0,0,.06);overflow:hidden; height: stretch;}
.jad-profile-card__topbar{background:#f8fafc;border-bottom:1px solid #e2e8f0;padding:8px 18px;font-size:11.5px;font-weight:600;color:#64748b;display:flex;align-items:center;gap:6px}
.jad-profile-card__topbar i{color:#6366f1}
.jad-profile-card__body{padding:18px; height: stretch;}
.jad-profile-card__identity-row{display:flex;gap:12px;align-items:flex-start}
.jad-profile-card__avatar{width:64px;height:64px;border-radius:50% !important;object-fit:cover;border:2px solid #fff;box-shadow:0 0 0 1px #e2e8f0;flex-shrink:0}
.jad-profile-card__identity{min-width:0}
.jad-profile-card__name{font-size:15px;font-weight:700;color:#1e293b;margin:0 0 3px}
.jad-profile-card__resume{font-size:12px;color:#64748b;margin:0}
.jad-profile-card__resume--muted{font-style:italic;color:#94a3b8}
.jad-profile-card__skills{display:flex;flex-wrap:wrap;gap:5px;list-style:none;margin:12px 0 0;padding:0}
.jad-profile-card__actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;flex-wrap:wrap}
.jad-profile-card__like-dislike{display:flex;gap:6px}
.jad-profile-card__thumb{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid #e2e8f0;color:#94a3b8;transition:background .15s,color .15s}
.jad-profile-card__thumb:hover{background:#f8fafc}
.jad-profile-card__thumb i.clientreponseaddlike{color:#16a34a}
.jad-profile-card__thumb i.clientreponseadddislike{color:#dc2626}
.jad-profile-card__contact{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px;font-size:12.5px;color:#475569}
.jad-profile-card__contact i{color:#6366f1;margin-right:4px}
.jad-profile-card__contact a{color:#6366f1;text-decoration:underline;font-weight:600}
.jad-profile-card__contact a:hover{text-decoration:underline}
.jad-profile-card__divider{height:1px;background:#f1f5f9;margin:16px 0}
.jad-profile-card__exp-title{font-size:14px;font-weight:700;color:#1e293b;margin:0 0 12px}
.jad-profile-card__meta{display:flex;flex-direction:column;gap:8px}
.jad-profile-card__row{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;color:#475569;padding:10px 12px;background:#f8fafc;border-radius:8px;border:1px solid #f1f5f9}
.jad-profile-card__row i{color:#6366f1;font-size:13px;margin-top:2px;flex-shrink:0;width:14px;text-align:center}
.jad-profile-card__row-content{display:flex;flex-direction:column;gap:2px;min-width:0}
.jad-profile-card__row-content strong{color:#1e293b;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.jad-row-line{display:block}

/* ── jad-stat-row — Profile tab stat tiles ───────────────────────────────── */
.jad-stat-row{display:flex;gap:10px;flex-wrap:wrap}
.jad-stat-item{flex:1 1 100px;text-align:center;background:#f8fafc;border:1px solid #f1f5f9;border-radius:10px;padding:14px 10px}
.jad-stat-item__value{display:block;font-size:20px;font-weight:800;color:#1e293b;line-height:1.2}
.jad-stat-item__label{display:flex;align-items:center;justify-content:center;gap:4px;font-size:10.5px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.03em;margin-top:4px}
.jad-stat-item__label i{color:#6366f1}

/* ── jad-timeline — Timeline tab ─────────────────────────────────────────── */
.jad-timeline{list-style:none;margin:0;padding:0;position:relative}
.jad-timeline__item{display:flex;gap:12px;padding-bottom:18px;position:relative}
.jad-timeline__item:not(:last-child):before{content:'';position:absolute;left:5px;top:14px;bottom:0;width:2px;background:#e2e8f0}
.jad-timeline__dot{width:12px;height:12px;border-radius:50%;background:#6366f1;flex-shrink:0;margin-top:4px;box-shadow:0 0 0 3px #eef2ff}
.jad-timeline__card{flex:1;min-width:0;background:#f8fafc;border:1px solid #f1f5f9;border-radius:10px;padding:10px 14px}
.jad-timeline__head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.jad-timeline__status{font-size:12.5px;font-weight:700;color:#1e293b}
.jad-timeline__date{font-size:11px;color:#94a3b8}
.jad-timeline__text{font-size:12.5px;color:#475569;margin:6px 0 0;line-height:1.6}
.jad-timeline__empty{padding:24px;text-align:center;font-size:12.5px;color:#94a3b8}

/* ── jad-note-card — Notes tab ────────────────────────────────────────────── */
.jad-note-card{position:relative;background:#f8fafc;border:1px solid #f1f5f9;border-radius:10px;padding:12px 40px 12px 14px;margin-bottom:10px}
.jad-note-card__actions{position:absolute;top:10px;right:10px;display:flex;gap:6px}
.jad-note-card__actions a{color:#94a3b8;font-size:12px}
.jad-note-card__actions a:hover{color:#6366f1}
.jad-note-card__text{font-size:12.5px;color:#475569;margin:0;line-height:1.6}
.jad-note-card__edit-actions{text-align:right;margin-top:8px;font-size:12px}

/* ── jad-notice — schedule tab info banner ───────────────────────────────── */
.jad-notice{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:12px 16px;margin-bottom:14px}
.jad-notice p{margin:0 0 8px;font-size:12.5px;color:#92400e}

/* ── jad-schedule — schedule tab wrapper ─────────────────────────────────── */
.jad-schedule{max-height:400px;overflow-y:auto}

/* ── jad-chat — Messages tab bubble retint (overrides legacy .mesgs colours) */
.jad-chat{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}
.jad-chat__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:48px 24px;color:#94a3b8; height: stretch;}
.jad-chat__empty i{font-size:50px;}
.jad-chat__empty span{font-size:15.5px;font-weight:500}
.jad-chat .sent_msg p{background:linear-gradient(135deg,#6366f1,#4f46e5)!important}
.jad-chat .received_withd_msg p{background:#f1f5f9!important;color:#334155!important}
.jad-chat .msg_send_btn{background:linear-gradient(135deg,#6366f1,#4f46e5)!important}
.jad-chat .type_msg{border-top-color:#e2e8f0}

/* ── jad-composer — bottom note/email composer bar ───────────────────────── */
.jad-composer{border-top:1px solid #e2e8f0;background:#f8fafc;padding:14px 20px;margin-top:8px}
.jad-composer__label{font-size:12px;font-weight:700;color:#475569;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;display:block}
.jad-composer__actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:10px}
.jad-composer__email-hint{margin-right:auto;font-size:12.5px;color:#475569}

/* ── relocated inline-style rules from JobApplicantData.cshtml ──────────── */
#ui-datepicker-div{z-index:10000!important}
.moment-picker{z-index:999999!important}
.disabledLink{color:#ccc;pointer-events:none;opacity:.6}

/* ═══════════════════════════════════════════════════════════════════════════
   Instructor Dashboard (Views/Instructor/DashboardPage.cshtml) — idb- prefix
   ═══════════════════════════════════════════════════════════════════════════ */

/* — KPI card with two side-by-side values (Training Hours, Programs, Courses) — */
.idb-kpi-duo{display:flex;gap:22px;margin-top:2px}
.idb-kpi-duo__part{display:flex;flex-direction:column;text-decoration:none}
.idb-kpi-duo__part:hover{text-decoration:none}
.idb-kpi-duo__value{font-size:22px;font-weight:800;color:#1e293b;line-height:1.15}
a.idb-kpi-duo__part .idb-kpi-duo__value{color:#4f46e5}
a.idb-kpi-duo__part:hover .idb-kpi-duo__value{color:#6366f1}
.idb-kpi-duo__caption{font-size:11px;color:#94a3b8;margin-top:1px;white-space:nowrap}

/* — Generic dashboard panel: white card, header strip, padded body — */
.idb-panel{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 12px rgba(15,23,42,.06);margin-bottom:20px;overflow:hidden}
.idb-panel__header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid #f1f5f9;background:#fff}
.idb-panel__title{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:700;color:#1e293b;margin:0}
/* extra specificity + !important: legacy .instructor_module h4>i paints icons lime with !important */
.idb-panel .idb-panel__title>i{width:30px;height:30px;border-radius:8px;background:#eef2ff!important;color:#6366f1!important;display:inline-flex;align-items:center;justify-content:center;font-size:13px;padding:0!important;flex-shrink:0}
.idb-panel__actions{display:flex;align-items:center;gap:8px}
.idb-panel__body{padding:14px 18px}
.idb-panel__body--scroll{max-height:520px;overflow-y:auto}

/* — Compact select used in panel headers (event range filter) — */
.idb-select{height:34px;padding:0 28px 0 12px;border:1.5px solid #e2e8f0;border-radius:8px;background:#f8fafc;font-size:12.5px;font-weight:600;color:#475569;outline:none;cursor:pointer;transition:border-color .15s,background .15s;appearance:auto}
.idb-select:hover{border-color:#c7d2fe}
.idb-select:focus{border-color:#6366f1;background:#fff;box-shadow:0 0 0 3px rgba(99,102,241,.12)}

/* — Instructor profile card — */
.idb-profile{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 12px rgba(15,23,42,.06);margin-bottom:20px;overflow:hidden;text-align:center;padding-bottom:20px}
.idb-profile__banner{height:72px;background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 55%,#a78bfa 100%)}
.idb-profile__avatar{width:84px;height:84px;margin:-42px auto 0;border-radius:50%;overflow:hidden;border:4px solid #fff;box-shadow:0 4px 14px rgba(15,23,42,.15);background:#f1f5f9}
.idb-profile__avatar img{width:100%;height:100%;object-fit:cover}
.idb-profile__name{font-size:16px;font-weight:700;color:#1e293b;margin:12px 16px 2px}
.idb-profile__email{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12.5px;color:#64748b;margin:0 16px;word-break:break-all}
.idb-profile__email i{color:#94a3b8;flex-shrink:0}

/* — Upcoming activity / event timeline — */
.idb-event-list{list-style:none;margin:0;padding:0}
.idb-event{display:flex;align-items:flex-start;gap:12px;padding:13px 0;border-bottom:1px solid #f8fafc}
.idb-event:last-child{border-bottom:none;padding-bottom:0}
.idb-event__date{width:46px;flex-shrink:0;border-radius:10px;background:#eef2ff;color:#4f46e5;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:7px 0;border:1px solid #e0e7ff}
.idb-event__day{font-size:17px;font-weight:800;line-height:1}
.idb-event__month{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;margin-top:3px}
.idb-event__date.Meeting{background:#ecfdf5;color:#059669;border-color:#d1fae5}
.idb-event__date.Exam{background:#fef2f2;color:#dc2626;border-color:#fee2e2}
.idb-event__date.Course{background:#fffbeb;color:#d97706;border-color:#fef3c7}
.idb-event__date.LiveStream{background:#fdf2f8;color:#db2777;border-color:#fce7f3}
.idb-event__date.Media{background:#f0f9ff;color:#0284c7;border-color:#e0f2fe}
.idb-event__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.idb-event__title{font-size:13.5px;font-weight:700;color:#1e293b;text-decoration:none;line-height:1.35;word-break:break-word}
.idb-event__title:hover{color:#4f46e5;text-decoration:none}
.idb-event__desc{font-size:12px;color:#64748b;line-height:1.5;word-break:break-word}
.idb-event__desc a{color:#6366f1;font-weight:600;text-decoration:none}
.idb-event__desc a:hover{text-decoration:underline}
.idb-event__meta{display:flex;align-items:center;gap:5px;font-size:12px;color:#94a3b8}
.idb-event__meta i{font-size:11px}
.idb-event__action{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#6366f1;text-decoration:none;margin-top:3px;width:fit-content}
.idb-event__action:hover{color:#4f46e5;text-decoration:none}
.idb-event__action[disabled],.idb-event__action.disabledLink{color:#cbd5e1;pointer-events:none}
.idb-event__meet{display:flex;flex-direction:column;gap:4px;margin-top:2px}
.idb-event__meet small{font-size:11px;color:#94a3b8;display:flex;align-items:center;gap:5px}

/* — Pending-evaluation filter pills (ul keeps .statusorpositiond for controller jQuery) — */
.idb-filter{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0}
.idb-filter li{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border:1.5px solid #e2e8f0;border-radius:999px;background:#fff;font-size:12px;font-weight:600;color:#475569;cursor:pointer;user-select:none;transition:border-color .15s,background .15s,color .15s;margin:0}
.idb-filter li:hover{border-color:#c7d2fe;color:#4f46e5}
.idb-filter li.active{background:#eef2ff;border-color:#6366f1;color:#4338ca}
.idb-filter__dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.idb-filter__dot--indigo{background:#6366f1}
.idb-filter__dot--sky{background:#0ea5e9}
.idb-filter__dot--amber{background:#f59e0b}
.idb-filter__count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#f1f5f9;color:#64748b;font-size:11px;font-weight:800}
.idb-filter li.active .idb-filter__count{background:#6366f1;color:#fff}

/* — Pending-evaluation list items (type stripe classes come from existing ng-class) — */
.idb-eval{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border:1px solid #f1f5f9;border-left:4px solid #6366f1;border-radius:10px;background:#fff;margin-bottom:10px;box-shadow:0 1px 4px rgba(15,23,42,.04)}
.idb-eval:last-child{margin-bottom:0}
.idb-eval.assileftbox{border-left-color:#6366f1}
.idb-eval.cfernce{border-left-color:#0ea5e9}
.idb-eval.assignments{border-left-color:#f59e0b}
.idb-eval__body{flex:1;min-width:200px;display:flex;flex-direction:column;gap:2px}
.idb-eval__name{font-size:13.5px;font-weight:700;color:#1e293b;text-decoration:none;width:fit-content}
.idb-eval__name:hover{color:#4f46e5;text-decoration:none}
.idb-eval__course{font-size:12px;color:#64748b;margin:0;word-break:break-word}
.idb-eval__course span{color:#6366f1;font-weight:600}
.idb-eval__date{display:flex;align-items:center;gap:5px;font-size:11.5px;color:#94a3b8;margin:0}
.idb-eval__actions{flex-shrink:0}

/* — Community discussion rows — */
.idb-comm-list{list-style:none;margin:0;padding:0}
.idb-comm{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid #f8fafc}
.idb-comm:last-child{border-bottom:none;padding-bottom:0}
.idb-comm__icon{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,#fdf2f8,#fce7f3);color:#db2777;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.idb-comm__body{flex:1;min-width:180px}
.idb-comm__title{font-size:13.5px;font-weight:700;color:#1e293b;margin:0 0 3px;word-break:break-word}
.idb-comm__date{display:flex;align-items:center;gap:5px;font-size:11.5px;color:#94a3b8;margin:0}
.idb-comm__actions{flex-shrink:0}

/* — Empty states — */
.idb-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:40px 20px;color:#94a3b8;text-align:center;list-style:none}
.idb-empty i{font-size:30px;color:#cbd5e1}
.idb-empty span{font-size:13px;font-weight:600}
.idb-empty--success i{color:#34d399}
.idb-empty--success span{color:#059669}

/* — Grid gutters: inner-only so column outer edges align with header/KPI row — */
@media(min-width:992px){
.idb-col--left{padding-right:10px}
.idb-col--right{padding-left:10px}
}

/* =========================================================================
   Instructor › Training Program Details  (.instr-tpd)
   Scoped design system: hero, vertical tab rail, event timeline, filters.
   ========================================================================= */

/* — Event-type accent tokens — */
.instr-tpd{
  --tpd-meeting:#0ea5e9;   --tpd-meeting-bg:#e0f2fe;   --tpd-meeting-fg:#0369a1;
  --tpd-course:#10b981;    --tpd-course-bg:#d1fae5;    --tpd-course-fg:#047857;
  --tpd-class:#f59e0b;     --tpd-class-bg:#fef3c7;     --tpd-class-fg:#b45309;
  --tpd-exam:#8b5cf6;      --tpd-exam-bg:#ede9fe;      --tpd-exam-fg:#6d28d9;
  --tpd-assign:#3b82f6;    --tpd-assign-bg:#dbeafe;    --tpd-assign-fg:#1d4ed8;
  --tpd-live:#ef4444;      --tpd-live-bg:#fee2e2;      --tpd-live-fg:#b91c1c;
  --tpd-ojt:#6366f1;       --tpd-ojt-bg:#e0e7ff;       --tpd-ojt-fg:#4338ca;
  --tpd-pract:#06b6d4;     --tpd-pract-bg:#cffafe;     --tpd-pract-fg:#0e7490;
  --tpd-repro:#14b8a6;     --tpd-repro-bg:#ccfbf1;     --tpd-repro-fg:#0f766e;
  --tpd-media:#d946ef;     --tpd-media-bg:#fae8ff;     --tpd-media-fg:#a21caf;
  --tpd-bot:#2563eb;       --tpd-bot-bg:#dbeafe;       --tpd-bot-fg:#1e40af;
  --tpd-survey:#a855f7;    --tpd-survey-bg:#f3e8ff;    --tpd-survey-fg:#7e22ce;
  --tpd-break:#64748b;     --tpd-break-bg:#f1f5f9;     --tpd-break-fg:#475569;
}

/* ── Hero: program summary card ─────────────────────────────────────────── */
.tpd-hero{display:flex;gap:20px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;
  box-shadow:0 2px 12px rgba(15,23,42,.07);padding:18px;margin-bottom:20px;align-items:flex-start;}
.tpd-hero__media{flex:0 0 200px;max-width:200px;border-radius:12px;overflow:hidden;background:#f1f5f9;aspect-ratio:16/10}
.tpd-hero__media img{width:100%;height:100%;object-fit:cover;display:block}
.tpd-hero__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:8px}
.tpd-hero__top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.tpd-hero__title{font-size:20px;font-weight:700;color:#0f172a;margin:0;line-height:1.3;word-break:break-word}
.tpd-hero__cat{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:#6366f1;background:#eef2ff;border-radius:6px;padding:3px 9px;width:max-content}
.tpd-hero__meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.tpd-hero__desc{font-size:13px;color:#64748b;line-height:1.6;margin:2px 0 0;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tpd-hero__desc p{margin:0}
.tpd-hero__desc--muted{font-style:italic;color:#94a3b8}

/* — Meta chip (shared by hero + event cards) — */
.tpd-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:#475569;
  background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:5px 11px;line-height:1.4;white-space:nowrap}
.tpd-chip i{font-size:11px;color:#6366f1}
.tpd-chip--wrap{white-space:normal}

/* ── Layout: rail + content ─────────────────────────────────────────────── */
.tpd-shell{display:flex;align-items:flex-start;gap:20px}
.tpd-shell__rail{flex:0 0 232px;max-width:232px;position:sticky;top:16px}
.tpd-shell__main{flex:1 1 auto;min-width:0}

/* ── Vertical tab rail ──────────────────────────────────────────────────── */
.tpd-rail{list-style:none;margin:0;padding:8px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;
  box-shadow:0 2px 12px rgba(15,23,42,.07);display:flex;flex-direction:column;gap:2px}
.tpd-rail>li{margin:0;padding:0;float:none;list-style:none}
.tpd-rail>li>a{display:flex!important;align-items:center;gap:11px;padding:11px 13px;border-radius:10px;
  font-size:13px;font-weight:600;color:#64748b;text-decoration:none;background:transparent;border:none;
  transition:background .15s,color .15s;line-height:1.35;min-height:44px;cursor:pointer;position:relative}
.tpd-rail>li>a .tpd-rail__ico{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;
  min-width:28px;border-radius:8px;background:#f1f5f9;color:#94a3b8;font-size:13px;transition:background .15s,color .15s}
.tpd-rail>li>a:hover,.tpd-rail>li>a:focus{background:#f8fafc;color:#4f46e5;text-decoration:none;outline:none}
.tpd-rail>li>a:hover .tpd-rail__ico{background:#eef2ff;color:#6366f1}
.tpd-rail>li.active>a{background:#eef2ff;color:#4338ca;font-weight:700}
.tpd-rail>li.active>a .tpd-rail__ico{background:#6366f1;color:#fff}
.tpd-rail>li.active>a::before{content:'';position:absolute;left:0;top:9px;bottom:9px;width:3px;
  background:#6366f1;border-radius:0 3px 3px 0}
.tpd-rail__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── Content card ───────────────────────────────────────────────────────── */
.tpd-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;box-shadow:0 2px 12px rgba(15,23,42,.07);
  overflow:hidden;margin-bottom:20px}
.tpd-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:14px 20px;background:#f8fafc;border-bottom:1px solid #e2e8f0}
.tpd-card__title{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#334155;
  text-transform:uppercase;letter-spacing:.07em;margin:0}
.tpd-card__title i{color:#6366f1;font-size:13px}
.tpd-card__body{padding:20px}
.tpd-card__sub{font-size:12px;color:#64748b;margin:0}

/* — Prose block (Overview description / outcomes) — */
.tpd-prose{font-size:14px;line-height:1.7;color:#475569;margin:0 0 20px}
.tpd-prose:last-child{margin-bottom:0}
.tpd-prose img{max-width:100%;height:auto}
.tpd-prose--muted{color:#94a3b8;font-style:italic}
.tpd-section-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#6366f1;
  text-transform:uppercase;letter-spacing:.07em;margin:0 0 10px}
.tpd-section-label i{font-size:12px}

/* ── Sub-tabs (Ongoing / Past) + toolbar ────────────────────────────────── */
.tpd-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 20px;background:#f8fafc;border-bottom:1px solid #e2e8f0}
.tpd-subtabs{display:flex;gap:6px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.tpd-subtabs>li{margin:0;float:none}
.tpd-subtabs>li>a{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:999px;
  font-size:13px;font-weight:600;color:#64748b;background:#fff;border:1px solid #e2e8f0;text-decoration:none;
  cursor:pointer;transition:background .15s,color .15s,border-color .15s;min-height:38px;line-height:1.4}
.tpd-subtabs>li>a:hover{background:#f1f5f9;color:#4f46e5;text-decoration:none}
.tpd-subtabs>li.active>a{background:#eef2ff;border-color:#c7d2fe;color:#4338ca}
.tpd-toolbar__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tpd-filter-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 16px;border-radius:999px;
  font-size:13px;font-weight:600;color:#475569;background:#fff;border:1px solid #e2e8f0;cursor:pointer;
  min-height:38px;transition:background .15s,border-color .15s,color .15s}
.tpd-filter-btn:hover{background:#f1f5f9;color:#4f46e5;border-color:#c7d2fe}
.tpd-filter-btn.is-open{background:#eef2ff;border-color:#c7d2fe;color:#4338ca}
.tpd-filter-btn__count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;
  padding:0 6px;border-radius:999px;background:#6366f1;color:#fff;font-size:11px;font-weight:700}

/* — Filter drawer — */
.tpd-filter{display:none;padding:18px 20px;background:#fff;border-bottom:1px solid #e2e8f0}
.tpd-filter.is-open{display:block}
.tpd-filter__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:20px}
.tpd-filter__label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#334155;
  text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px}
.tpd-filter__label i{color:#6366f1;font-size:12px}
.tpd-filter__date{
    position: relative;
    display: flex;
    align-items: center;
}
.tpd-filter__date .form-control{
    padding-right:38px;
    height:40px;
    border-radius:10px;
    border:1px solid #e2e8f0;
    font-size:13px;
    box-shadow:none;
    border-right: none !important;
    border-radius: 8px 0 0 8px !important;
}
.tpd-filter__date>svg{
        height: 34px;
    border: 1px solid #cbd5e1 !important;
    border-radius: 0 8px 8px 0 !important;
    padding: 7px;
    width: 35px;
}
.daterangepicker.dropdown-menu.show-calendar.opensleft{
        top: 613.4px;
    /* right: 0px; */
    left: 57% !important;
    width: 500px !important;
    max-width: 500px;
    min-width: 500px;
}
.tpd-filter__types{display:flex;flex-wrap:wrap;gap:8px}
.tpd-check{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:9px;background:#f8fafc;
  border:1px solid #e2e8f0;font-size:12px;font-weight:600;color:#64748b;cursor:pointer;margin:0;position:relative;
  transition:background .15s,border-color .15s,color .15s;min-height:36px;line-height:1.4}
.tpd-check:hover{background:#f1f5f9;color:#475569}
.tpd-check input{position:absolute;opacity:0;width:0;height:0}
.tpd-check__dot{width:9px;height:9px;border-radius:50%;background:#cbd5e1;flex-shrink:0;transition:background .15s; display: none;}
.tpd-check.active{background:#eef2ff;border-color:#c7d2fe;color:#4338ca}
.tpd-check.active .tpd-check__dot{background:#6366f1}

.tpd-check.meeting{
        background: var(--tpd-meeting-bg);
    color: var(--tpd-meeting-fg);
    border-color: var(--tpd-meeting-fg);
}
.tpd-check.meeting.active{
        background: var(--tpd-meeting);
    color:#fff;
    border-color: var(--tpd-meeting);
}

.tpd-check.meeting .tpd-check__dot{
    background: var(--tpd-meeting);
}

.tpd-check.meeting.active .tpd-check__dot{
    background: #fff;
}

.tpd-check.course{
        background: var(--tpd-course-bg);
    color: var(--tpd-course-fg);
    border-color: var(--tpd-course-fg);
}

.tpd-check.course.active{
        background: var(--tpd-course);
    color: #fff;
    border-color: var(--tpd-course);
}

.tpd-check.course .tpd-check__dot{
    background: var(--tpd-course);
}

.tpd-check.course.active .tpd-check__dot{
    background: #fff;
}

.tpd-check.classroom{
        background: var(--tpd-class-bg);
    color: var(--tpd-class-fg);
    border-color: var(--tpd-class);
}

.tpd-check.classroom.active{
        background: var(--tpd-class);
    color: #fff;
    border-color: var(--tpd-class);
}
.tpd-check.classroom .tpd-check__dot{
    background: var(--tpd-class);
}
.tpd-check.classroom.active .tpd-check__dot{
    background: #fff;
}

.tpd-check.exam{
    background: var(--tpd-exam-bg);
    color: var(--tpd-exam-fg);
    border-color: var(--tpd-exam-fg);
}
.tpd-check.exam.active{
    background: var(--tpd-exam);
    color: #fff;
    border-color: var(--tpd-exam);
}
.tpd-check.exam .tpd-check__dot{
    background: var(--tpd-exam-fg);
}
.tpd-check.exam.active .tpd-check__dot{
    background: #fff;
}


.tpd-check.assign{
    background: var(--tpd-assign-bg);
    color: var(--tpd-assign-fg);
    border-color: var(--tpd-assign-fg);
}
.tpd-check.assign.active{
    background: var(--tpd-assign);
    color: #fff;
    border-color: var(--tpd-assign);
}
.tpd-check.assign .tpd-check__dot{
    background: var(--tpd-assign-fg);
}
.tpd-check.assign.active .tpd-check__dot{
    background:#fff;
}

.tpd-check.stream{
    background: var(--tpd-live-bg);
    color: var(--tpd-live-fg);
    border-color: var(--tpd-live-fg);
}
.tpd-check.stream.active{
    background: var(--tpd-live);
    color: #fff;
    border-color: var(--tpd-live);
}
.tpd-check.stream .tpd-check__dot{
    background: var(--tpd-live-fg);
}
.tpd-check.stream.active .tpd-check__dot{
    background: #fff;
}

.tpd-check.ojt{
    background: var(--tpd-ojt-bg);
    color: var(--tpd-ojt-fg);
    border-color: var(--tpd-ojt-fg);
}
.tpd-check.ojt.active{
    background: var(--tpd-ojt);
    color: #fff;
    border-color: var(--tpd-ojt);
}
.tpd-check.ojt .tpd-check__dot{
    background: var(--tpd-ojt-fg);
}
.tpd-check.ojt.active .tpd-check__dot{
    background:#fff;
}

.tpd-check.practical{
    background: var(--tpd-pract-bg);
    color: var(--tpd-pract-fg);
    border-color: var(--tpd-pract-fg);
}
.tpd-check.practical.active{
    background: var(--tpd-pract);
    color:#fff;
    border-color: var(--tpd-pract);
}
.tpd-check.practical .tpd-check__dot{
    background: var(--tpd-pract-fg);
}
.tpd-check.practical.active .tpd-check__dot{
    background: #fff;
}


.tpd-check.repro{
    background: var(--tpd-repro-bg);
    color: var(--tpd-repro-fg);
    border-color: var(--tpd-repro-fg);
}
.tpd-check.repro.active{
    background: var(--tpd-repro);
    color: #fff;
    border-color: var(--tpd-repro);
}
.tpd-check.repro .tpd-check__dot{
    background: var(--tpd-repro-fg);
}
.tpd-check.repro.active .tpd-check__dot{
    background: #fff;
}

.tpd-check.media{
    background: var(--tpd-media-bg);
    color: var(--tpd-media-fg);
    border-color: var(--tpd-media-fg);
}
.tpd-check.media.active{
    background: var(--tpd-media);
    color:#fff;
    border-color: var(--tpd-media);
}
.tpd-check.media .tpd-check__dot{
    background: var(--tpd-media-fg);
}
.tpd-check.media.active .tpd-check__dot{
    background: #fff;
}

.tpd-check.chatbot{
    background: var(--tpd-bot-bg);
    color: var(--tpd-bot-fg);
    border-color: var(--tpd-bot-fg);
}
.tpd-check.chatbot.active{
    background: var(--tpd-bot);
    color:#fff;
    border-color: var(--tpd-bot);
}
.tpd-check.chatbot .tpd-check__dot{
    background: var(--tpd-bot-fg);
}
.tpd-check.chatbot.active .tpd-check__dot{
    background:#fff;
}


.tpd-check.survey{
    background: var(--tpd-survey-bg);
    color: var(--tpd-survey-fg);
    border-color: var(--tpd-survey-fg);
}
.tpd-check.survey.active{
    background: var(--tpd-survey);
    color:#fff;
    border-color: var(--tpd-survey);
}
.tpd-check.survey .tpd-check__dot{
    background: var(--tpd-survey-fg);
}
.tpd-check.survey.active .tpd-check__dot{
    background: #fff;
}
/* ── Timeline ───────────────────────────────────────────────────────────── */
.tpd-timeline{padding:20px}
.tpd-day{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.tpd-day:not(:first-child){margin-top:26px}
.tpd-day__label{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:#4338ca;
  background:#eef2ff;border:1px solid #e0e7ff;border-radius:999px;padding:6px 14px;white-space:nowrap}
.tpd-day__label i{font-size:11px}
.tpd-day__line{flex:1 1 auto;height:1px;background:#e2e8f0}

/* — Event card — */
.tpd-event{display:flex;gap:0;background:#fff;border:1px solid #e2e8f0;border-radius:14px;overflow:hidden;
  margin-bottom:12px;transition:box-shadow .18s,border-color .18s,transform .18s}
.tpd-event:hover{box-shadow:0 8px 24px rgba(15,23,42,.09);border-color:#c7d2fe;transform:translateY(-1px)}
.tpd-event__rail{flex:0 0 74px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;
  background:#f8fafc;border-right:1px solid #e2e8f0;position:relative}
.tpd-event__time{font-size:12px;font-weight:700;color:#334155;text-align:center;line-height:1.3;white-space:nowrap}
.tpd-event__dot{width:12px;height:12px;border-radius:50%;background:#cbd5e1;flex-shrink:0;
  box-shadow:0 0 0 4px rgba(203,213,225,.28)}
.tpd-event__main{flex:1 1 auto;min-width:0;display:flex;gap:18px;padding:16px 18px;flex-wrap:wrap}
.tpd-event__info{flex:1 1 340px;min-width:0}
.tpd-event__side{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:10px;
  min-width:170px;margin-left:auto}
.tpd-event__badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;
  font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;
  background:#f1f5f9;color:#475569;border:1px solid #e2e8f0;margin-bottom:8px}
.tpd-event__badge i{font-size:11px}
.tpd-event__title{font-size:15px;font-weight:700;color:#0f172a;margin:0 0 5px;line-height:1.4;word-break:break-word}
.tpd-event__desc{font-size:13px;color:#64748b;line-height:1.6;margin:0 0 8px;word-break:break-word}
.tpd-event__meta{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:8px}
.tpd-event__inst{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}
.tpd-event__inst-item{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:#4338ca;
  background:#eef2ff;border-radius:999px;padding:4px 11px}
.tpd-event__inst-item i{font-size:11px}
.tpd-event__actions{display:flex;flex-wrap:wrap;gap:7px;padding-top:10px;border-top:1px dashed #e2e8f0}
.tpd-event__due{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#b45309;
  background:#fffbeb;border:1px solid #fde68a;border-radius:8px;padding:6px 12px;white-space:nowrap}
.tpd-event__due i{font-size:11px}

/* — Event-type colouring: badge tint + rail dot fill — */
.tpd-event__badge.tpd-t-meeting{background:var(--tpd-meeting-bg);color:var(--tpd-meeting-fg);border-color:transparent}
.tpd-event__badge.tpd-t-course{background:var(--tpd-course-bg);color:var(--tpd-course-fg);border-color:transparent}
.tpd-event__badge.tpd-t-class{background:var(--tpd-class-bg);color:var(--tpd-class-fg);border-color:transparent}
.tpd-event__badge.tpd-t-exam{background:var(--tpd-exam-bg);color:var(--tpd-exam-fg);border-color:transparent}
.tpd-event__badge.tpd-t-assign{background:var(--tpd-assign-bg);color:var(--tpd-assign-fg);border-color:transparent}
.tpd-event__badge.tpd-t-live{background:var(--tpd-live-bg);color:var(--tpd-live-fg);border-color:transparent}
.tpd-event__badge.tpd-t-ojt{background:var(--tpd-ojt-bg);color:var(--tpd-ojt-fg);border-color:transparent}
.tpd-event__badge.tpd-t-pract{background:var(--tpd-pract-bg);color:var(--tpd-pract-fg);border-color:transparent}
.tpd-event__badge.tpd-t-repro{background:var(--tpd-repro-bg);color:var(--tpd-repro-fg);border-color:transparent}
.tpd-event__badge.tpd-t-media{background:var(--tpd-media-bg);color:var(--tpd-media-fg);border-color:transparent}
.tpd-event__badge.tpd-t-bot{background:var(--tpd-bot-bg);color:var(--tpd-bot-fg);border-color:transparent}
.tpd-event__badge.tpd-t-survey{background:var(--tpd-survey-bg);color:var(--tpd-survey-fg);border-color:transparent}
.tpd-event__badge.tpd-t-break{background:var(--tpd-break-bg);color:var(--tpd-break-fg);border-color:transparent}

.tpd-event__dot.tpd-t-meeting{background:var(--tpd-meeting);box-shadow:0 0 0 4px var(--tpd-meeting-bg)}
.tpd-event__dot.tpd-t-course{background:var(--tpd-course);box-shadow:0 0 0 4px var(--tpd-course-bg)}
.tpd-event__dot.tpd-t-class{background:var(--tpd-class);box-shadow:0 0 0 4px var(--tpd-class-bg)}
.tpd-event__dot.tpd-t-exam{background:var(--tpd-exam);box-shadow:0 0 0 4px var(--tpd-exam-bg)}
.tpd-event__dot.tpd-t-assign{background:var(--tpd-assign);box-shadow:0 0 0 4px var(--tpd-assign-bg)}
.tpd-event__dot.tpd-t-live{background:var(--tpd-live);box-shadow:0 0 0 4px var(--tpd-live-bg)}
.tpd-event__dot.tpd-t-ojt{background:var(--tpd-ojt);box-shadow:0 0 0 4px var(--tpd-ojt-bg)}
.tpd-event__dot.tpd-t-pract{background:var(--tpd-pract);box-shadow:0 0 0 4px var(--tpd-pract-bg)}
.tpd-event__dot.tpd-t-repro{background:var(--tpd-repro);box-shadow:0 0 0 4px var(--tpd-repro-bg)}
.tpd-event__dot.tpd-t-media{background:var(--tpd-media);box-shadow:0 0 0 4px var(--tpd-media-bg)}
.tpd-event__dot.tpd-t-bot{background:var(--tpd-bot);box-shadow:0 0 0 4px var(--tpd-bot-bg)}
.tpd-event__dot.tpd-t-survey{background:var(--tpd-survey);box-shadow:0 0 0 4px var(--tpd-survey-bg)}
.tpd-event__dot.tpd-t-break{background:var(--tpd-break);box-shadow:0 0 0 4px var(--tpd-break-bg)}

/* — Link / credential rows inside an event — */
.tpd-field{margin:0 0 10px}
.tpd-field__label{display:block;font-size:11px;font-weight:700;color:#64748b;text-transform:uppercase;
  letter-spacing:.06em;margin-bottom:5px}
.tpd-copy{display:flex;align-items:stretch;gap:0;max-width:100%;border:1px solid #e2e8f0;border-radius:9px;
  overflow:hidden;background:#f8fafc}
.tpd-copy__value{flex:1 1 auto;min-width:0;padding:8px 12px;font-size:12px;color:#334155;background:transparent;
  border:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5;box-shadow:none;height:auto}
.tpd-copy a.tpd-copy__value{color:#4f46e5;text-decoration:none;display:block}
.tpd-copy a.tpd-copy__value:hover{text-decoration:underline}
.tpd-copy__btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;padding:8px 13px;font-size:12px;
  font-weight:600;color:#4f46e5;background:#eef2ff;border:none;border-left:1px solid #e2e8f0;cursor:pointer;
  text-decoration:none;transition:background .15s;white-space:nowrap}
.tpd-copy__btn:hover{background:#e0e7ff;color:#4338ca;text-decoration:none}

/* — Empty state — */
.tpd-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  padding:52px 24px;color:#94a3b8;text-align:center}
.tpd-empty i{font-size:34px;color:#cbd5e1}
.tpd-empty span{font-size:14px;font-weight:500}

/* — Notes & files modal grid — */
.tpd-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.tpd-notes__col{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;background:#fff;
  display:flex;flex-direction:column;max-height:420px}
.tpd-notes__head{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#f8fafc;
  border-bottom:1px solid #e2e8f0;font-size:12px;font-weight:700;color:#334155;text-transform:uppercase;letter-spacing:.06em}
.tpd-notes__head i{color:#6366f1;font-size:13px}
.tpd-notes__list{padding:8px;overflow-y:auto;flex:1 1 auto}
.tpd-notes__item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:9px;font-size:13px;
  color:#475569;line-height:1.55}
.tpd-notes__item:hover{background:#f8fafc}
.tpd-notes__num{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  border-radius:6px;background:#eef2ff;color:#4338ca;font-size:11px;font-weight:700}
.tpd-notes__text{flex:1 1 auto;min-width:0;margin:0;word-break:break-word}

/* — Media preview surfaces — */
.tpd-media-player{height:400px;margin:0 0 20px;border-radius:12px;overflow:hidden;background:#0f172a}
.tpd-media-img{width:100%;max-height:440px;object-fit:contain;margin:0 0 20px;border-radius:12px;background:#f8fafc}
.tpd-media-audio{width:100%;margin:0 0 20px}

/* — Attendance / event picker toolbar — */
.tpd-picker{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;padding:16px 20px;background:#f8fafc;
  border:1px solid #e2e8f0;border-radius:14px;margin-bottom:16px}
.tpd-picker__field{flex:1 1 320px;min-width:0}
.tpd-picker__field label{display:block;font-size:12px;font-weight:700;color:#334155;text-transform:uppercase;
  letter-spacing:.06em;margin-bottom:7px}
.tpd-picker__field .form-control{height:42px;border-radius:10px;border:1px solid #e2e8f0;font-size:13px;box-shadow:none}

/* — Timepicker popup (carried over from legacy inline style) — */
.dn-timepicker-popup{max-height:250px!important;overflow-y:auto!important;background-clip:border-box!important}

/* — Page canvas tint. Falls back to the default #f1f1f1 where :has() is absent. — */
.page-content-wrapper:has(.instr-tpd),.page-content:has(.instr-tpd){background:#f8fafc}

/* — Modal form helpers (replace legacy inline styles) — */
.instr-tpd .mv-field-error{display:block;color:#dc2626;font-size:12px;font-weight:500;margin-top:4px}
.instr-tpd .tpd-modal-table{width:100%;table-layout:auto;empty-cells:show}
.instr-tpd .tpd-report-row{background:#e8fbff}
.instr-tpd .tpd-thumb-sm{max-width:100px;max-height:100px;height:auto}
.instr-tpd .tpd-radio-label{font-size:13px;font-weight:500;color:#475569;display:inline-flex;align-items:center;
  gap:6px;margin:0 14px 0 0;min-height:32px;cursor:pointer}
.instr-tpd .tpd-select-full{width:100%}

/* — Modals that must stack above the page chrome (was an inline z-index) — */
.modal.instr-modal--top{z-index:999992}
.modal.instr-modal--top+.modal-backdrop{z-index:999991}
/* Toast must clear even the raised modals */
.instr-tpd .ce-toast{z-index:999999}

/* ── Attendance modal ───────────────────────────────────────────────────── */
.tpd-att-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:12px 16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;margin-bottom:14px}
.tpd-att-bar__label{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:#334155;
  text-transform:uppercase;letter-spacing:.06em;margin:0}
.tpd-att-bar__label i{color:#6366f1;font-size:12px}
.tpd-att-bar__group{display:flex;gap:8px;flex-wrap:wrap}

/* Segmented Present / Absent control. The radio stays in the DOM (and focusable)
   so AngularJS ng-model/ng-value binding is untouched; the pill is its sibling. */
.tpd-att{position:relative;display:inline-flex;margin:0;cursor:pointer}
.tpd-att input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.tpd-att__pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;
  padding:7px 15px;border-radius:999px;border:1px solid #e2e8f0;background:#fff;color:#64748b;
  font-size:12px;font-weight:600;line-height:1.4;white-space:nowrap;
  transition:background .15s,border-color .15s,color .15s}
.tpd-att__pill i{font-size:11px}
.tpd-att:hover .tpd-att__pill{background:#f1f5f9;color:#475569}
.tpd-att input:focus-visible~.tpd-att__pill{outline:2px solid #6366f1;outline-offset:2px}
.tpd-att--present input:checked~.tpd-att__pill{background:#dcfce7;border-color:#86efac;color:#15803d}
.tpd-att--absent  input:checked~.tpd-att__pill{background:#fee2e2;border-color:#fca5a5;color:#b91c1c}

.tpd-att-cell{display:flex;gap:8px;flex-wrap:wrap}
.instr-tpd .modal-body .lst-grid{
    border-radius:12px;
    border:1px solid #e2e8f0;
    overflow:auto;
    max-height:fit-content;
}
.instr-tpd .modal-body .lst-grid>table{margin:0}
.instr-tpd .modal-body .lst-grid>table thead th{position:sticky;top:0;z-index:1;background:#f8fafc;
  padding:11px 16px;font-size:12px;font-weight:700;color:#334155;text-transform:uppercase;letter-spacing:.05em;
  border-bottom:1px solid #e2e8f0;white-space:nowrap}
.instr-tpd .modal-body .lst-grid>table tbody td{padding:11px 16px;font-size:13px;color:#475569;
  border-bottom:1px solid #f1f5f9;vertical-align:middle}
.instr-tpd .modal-body .lst-grid>table tbody tr:last-child td{border-bottom:none}
.instr-tpd .modal-body .lst-grid>table tbody tr:hover{background:#f8fafc}
.tpd-att-name{font-weight:600;color:#1e293b}
.tpd-att-idx{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;
  border-radius:7px;background:#eef2ff;color:#4338ca;font-size:11px;font-weight:700}
.instr-tpd .modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;
  padding:14px 20px;background:#f8fafc;border-top:1px solid #e2e8f0}

/* ── Modal form layout (Add Exam / generic) ─────────────────────────────── */
.instr-tpd .modal-body{padding:20px}
.instr-tpd .modal-body>.modal-footer,
.instr-tpd .modal-body form>.modal-footer{margin:20px -20px -20px;border-radius:0}

/* ph-btn has no disabled state of its own; ng-disabled/attr(disabled) needs one */
.instr-tpd .ph-btn[disabled],.instr-tpd .ph-btn.disabled{opacity:.5;cursor:not-allowed;
  box-shadow:none;transform:none;pointer-events:none}

.tpd-form__head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin:0 0 18px;padding-bottom:12px;border-bottom:1px solid #e2e8f0}
.tpd-form__title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:#1e293b;margin:0}
.tpd-form__title i{color:#6366f1;font-size:14px}
.tpd-form__note{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:#64748b;
  background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;padding:4px 11px;margin:0}
.tpd-form__note .tpd-req{font-size:12px}

.tpd-form__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px 18px;align-items:start}
.tpd-form__field{grid-column:span 12;display:flex;flex-direction:column;gap:6px;margin:0;min-width:0}
.tpd-form__field--third{grid-column:span 4}
.tpd-form__field--half{grid-column:span 6}

.tpd-label{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:#334155;
  text-transform:uppercase;letter-spacing:.05em;margin:0;line-height:1.4}
.tpd-req{color:#dc2626;font-weight:700;line-height:1}

.instr-tpd .tpd-form__field .form-control{width:100%;height:42px;padding:9px 13px;border:1px solid #e2e8f0;
  border-radius:10px;font-size:13px;color:#334155;background:#fff;box-shadow:none;transition:border-color .15s,box-shadow .15s}
.instr-tpd .tpd-form__field .form-control:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.15);outline:none}
.instr-tpd .tpd-form__field .form-control[disabled]{background:#f8fafc;color:#94a3b8}
.instr-tpd .tpd-form__field .oi-select{width:100%}

/* Input + trailing icon button (datepickers) */
.tpd-input-group{display:flex;align-items:stretch;width:100%;margin:0}
.instr-tpd .tpd-input-group .form-control{border-top-right-radius:0;border-bottom-right-radius:0;flex:1 1 auto;min-width:0}
.tpd-input-group__btn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:44px;height:42px;
  border:1px solid #e2e8f0;border-left:none;border-radius:0 10px 10px 0;background:#f8fafc;color:#6366f1;
  cursor:pointer;transition:background .15s,color .15s}
.tpd-input-group__btn:hover{background:#eef2ff;color:#4338ca}
.tpd-input-group__btn i{font-size:14px}

/* Segmented radio group (Day / Date) */
.tpd-seg{display:inline-flex;align-items:stretch;gap:3px;padding:3px;background:#f1f5f9;border:1px solid #e2e8f0;
  border-radius:10px;width:max-content;max-width:100%}
.tpd-seg__opt{position:relative;display:inline-flex;margin:0}
.tpd-seg__opt input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer}
.tpd-seg__opt>span{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;
  padding:6px 20px;border-radius:8px;font-size:12px;font-weight:600;color:#64748b;white-space:nowrap;
  transition:background .15s,color .15s,box-shadow .15s}
.tpd-seg__opt:hover>span{color:#4f46e5}
.tpd-seg__opt input:focus-visible~span{outline:2px solid #6366f1;outline-offset:2px}
.tpd-seg__opt input:checked~span{background:#fff;color:#4338ca;box-shadow:0 1px 3px rgba(15,23,42,.12)}

@media(max-width:1023px){
  .tpd-form__field--third{grid-column:span 6}
}
@media(max-width:767px){
  .instr-tpd .modal-dialog{width:90vw;max-width:560px;margin:20px auto}
  .tpd-att-bar{flex-direction:column;align-items:flex-start}
  .instr-tpd .modal-body .lst-grid{max-height:52vh}
  .tpd-form__grid{gap:14px}
  .tpd-form__field--third,.tpd-form__field--half{grid-column:span 12}
  .tpd-form__head{flex-direction:column;align-items:flex-start;gap:8px}
  .tpd-seg{width:100%}
  .tpd-seg__opt{flex:1 1 0}
  .tpd-seg__opt>span{width:100%}
}

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media(max-width:1023px){
  .tpd-shell{flex-direction:column;gap:14px}
  .tpd-shell__rail{flex:1 1 auto;max-width:100%;width:100%;position:static}
  .tpd-rail{flex-direction:row;overflow-x:auto;gap:6px;padding:8px;scrollbar-width:none;border-radius:12px}
  .tpd-rail::-webkit-scrollbar{display:none}
  .tpd-rail>li{flex:0 0 auto}
  .tpd-rail>li>a{white-space:nowrap}
  .tpd-rail>li.active>a::before{left:9px;right:9px;top:auto;bottom:0;width:auto;height:3px;border-radius:3px 3px 0 0}
  .tpd-hero__media{flex-basis:170px;max-width:170px}
}
@media(max-width:767px){
  .tpd-hero{flex-direction:column;padding:14px}
  .tpd-hero__media{flex:1 1 auto;max-width:100%;width:100%}
  .tpd-hero__title{font-size:17px}
  .tpd-filter__grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .tpd-event{flex-direction:column}
  .tpd-event__rail{flex:1 1 auto;flex-direction:row;justify-content:flex-start;gap:10px;padding:10px 16px;
    border-right:none;border-bottom:1px solid #e2e8f0}
  .tpd-event__main{flex-direction:column;gap:12px;padding:14px 16px}
  .tpd-event__side{align-items:flex-start;margin-left:0;min-width:0;width:100%}
  .tpd-timeline{padding:14px}
  .tpd-card__body{padding:16px}
  .tpd-notes{grid-template-columns:minmax(0,1fr)}
  .tpd-notes__col{max-height:300px}
  .tpd-media-player{height:240px}
}

/* ══ Pre-Assessment Evaluations — Comments tab (#comments) ═══════════════════ */
.pae-cmt{display:flex;flex-direction:column;gap:20px;width:100%;padding:4px 0 8px}

/* ── Composer card ── */
.pae-cmt__composer{background:#fff;border:1px solid #e2e8f0;border-radius:14px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);overflow:hidden}
.pae-cmt__composer-head{display:flex;align-items:center;gap:12px;padding:14px 18px;
  background:linear-gradient(180deg,#f8faff 0,#f3f5ff 100%);border-bottom:1px solid #eef1f8}
.pae-cmt__composer-icon{display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;flex-shrink:0;border-radius:9px;background:#6366f1;color:#fff;font-size:14px}
.pae-cmt__composer-titles{display:flex;flex-direction:column;min-width:0}
.pae-cmt__composer-title{margin:0;font-size:15px;font-weight:700;color:#1e293b;line-height:1.35}
.pae-cmt__composer-sub{font-size:12px;color:#64748b;line-height:1.4}
.pae-cmt__field{padding:16px 18px 18px}
.pae-cmt__textarea{width:100%;min-height:104px;resize:vertical;margin:0 !important;
  border:1px solid #dbe1ea !important;border-radius:10px !important;padding:12px 14px !important;
  font-size:14px !important;line-height:1.6;color:#1e293b;background:#fff;box-shadow:none !important;
  transition:border-color .15s ease,box-shadow .15s ease}
.pae-cmt__textarea::placeholder{color:#94a3b8}
.pae-cmt__textarea:focus{border-color:#6366f1 !important;
  box-shadow:0 0 0 3px rgba(99,102,241,.14) !important;outline:none}
.pae-cmt__composer-foot{display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:10px;margin-top:12px}
.pae-cmt__hint{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#94a3b8}
.pae-cmt__post{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 20px;border-radius:10px;border:1px solid #6366f1;background:#6366f1;
  color:#fff !important;font-size:14px;font-weight:600;cursor:pointer;text-decoration:none !important;
  transition:background .15s ease,box-shadow .15s ease,transform .1s ease}
.pae-cmt__post:hover,.pae-cmt__post:focus{background:#4f46e5;border-color:#4f46e5;
  color:#fff !important;text-decoration:none !important;box-shadow:0 4px 12px rgba(99,102,241,.28)}
.pae-cmt__post:active{transform:translateY(1px)}
.pae-cmt__post[disabled],.pae-cmt__post.disabled{opacity:.5;pointer-events:none;box-shadow:none}

/* ── Thread ── */
.pae-cmt__thread{background:#fff;border:1px solid #e2e8f0;border-radius:14px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);overflow:hidden}
.pae-cmt__thread-head{display:flex;align-items:center;gap:10px;padding:14px 18px;
  border-bottom:1px solid #eef1f8;background:#fbfcfe}
.pae-cmt__thread-title{margin:0;display:inline-flex;align-items:center;gap:8px;
  font-size:15px;font-weight:700;color:#1e293b;line-height:1.35}
.pae-cmt__thread-title i{color:#6366f1;font-size:15px}
.pae-cmt__count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;
  height:22px;padding:0 8px;border-radius:999px;background:#eef2ff;color:#4f46e5;
  font-size:12px;font-weight:700}
.pae-cmt__list{display:flex;flex-direction:column}
.pae-cmt__item{display:flex;gap:14px;padding:16px 18px;border-bottom:1px solid #f1f5f9;
  transition:background .15s ease}
.pae-cmt__item:last-child{border-bottom:none}
.pae-cmt__item:hover{background:#fafbff}
.pae-cmt__avatar{display:flex;align-items:center;justify-content:center;flex-shrink:0;
  width:40px;height:40px;border-radius:50%;background:#e2e8f0;color:#475569;
  font-size:15px;font-weight:700;text-transform:uppercase;line-height:1}
.pae-cmt__avatar--me{background:#6366f1;color:#fff}
.pae-cmt__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.pae-cmt__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pae-cmt__author{font-size:14px;font-weight:600;color:#1e293b;word-break:break-word}
.pae-cmt__badge{display:inline-flex;align-items:center;height:20px;padding:0 8px;
  border-radius:999px;background:#eef2ff;color:#4f46e5;font-size:11px;font-weight:600;
  letter-spacing:.02em}
.pae-cmt__time{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#94a3b8}
.pae-cmt__delete{display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;margin-left:auto;flex-shrink:0;border-radius:8px;border:1px solid transparent;
  background:transparent;color:#94a3b8;font-size:14px;text-decoration:none !important;
  transition:background .15s ease,color .15s ease,border-color .15s ease}
.pae-cmt__delete:hover,.pae-cmt__delete:focus{background:#fef2f2;border-color:#fecaca;color:#dc2626}
.pae-cmt__text{margin:0;font-size:14px;line-height:1.65;color:#334155;
  white-space:pre-wrap;word-break:break-word}

/* ── Empty state ── */
.pae-cmt__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;padding:56px 24px;text-align:center}
.pae-cmt__empty-icon{display:inline-flex;align-items:center;justify-content:center;
  width:64px;height:64px;border-radius:50%;background:#f1f5f9;color:#94a3b8;font-size:26px}
.pae-cmt__empty-text{margin:0;font-size:14px;font-weight:500;color:#64748b;max-width:420px}

/* ── Pager ── */
.pae-cmt__pager{display:flex;justify-content:center;padding:10px 14px;background:#f8fafc;border-top:1px solid #eef1f8}
.pae-cmt__pager .pagination{margin:0;float:none}
.pae-cmt__pager .pagination>li>a,.pae-cmt__pager .pagination>li>span{
  border:1px solid #e2e8f0;color:#475569;background:#fff;margin:0 2px;border-radius:8px !important;
  min-width:34px;text-align:center}
.pae-cmt__pager .pagination>li>a:hover{background:#eef2ff;color:#4f46e5;border-color:#c7d2fe}
.pae-cmt__pager .pagination>.active>a,.pae-cmt__pager .pagination>.active>span,
.pae-cmt__pager .pagination>.active>a:hover,.pae-cmt__pager .pagination>.active>span:hover{
  background:#6366f1;border-color:#6366f1;color:#fff}
.pae-cmt__pager .pagination>.disabled>a,.pae-cmt__pager .pagination>.disabled>span{
  color:#cbd5e1;background:#f8fafc;border-color:#eef1f8}

@media (max-width:768px){
  .pae-cmt{gap:16px}
  .pae-cmt__composer-head,.pae-cmt__thread-head{padding:12px 14px}
  .pae-cmt__field{padding:14px}
  .pae-cmt__item{padding:14px;gap:12px}
  .pae-cmt__composer-foot{flex-direction:column;align-items:stretch}
  .pae-cmt__post{width:100%}
  .pae-cmt__hint{order:2;justify-content:center}
  .pae-cmt__empty{padding:40px 16px}
}
@media (max-width:640px){
  .pae-cmt__avatar{width:34px;height:34px;font-size:13px}
  .pae-cmt__delete{margin-left:0}
  .pae-cmt__empty-icon{width:56px;height:56px;font-size:22px}
}

/* ══ Pre-Assessment Evaluations — confirm dialog (delete comment) ════════════ */
.pae-confirm{position:fixed;inset:0;top:0;right:0;bottom:0;left:0;z-index:10000;
  display:flex;align-items:center;justify-content:center;padding:20px}
.pae-confirm__backdrop{position:absolute;inset:0;top:0;right:0;bottom:0;left:0;
  background:rgba(15,23,42,.5);animation:pae-confirm-fade .18s ease}
.pae-confirm__dialog{position:relative;width:100%;max-width:420px;max-height:calc(100vh - 40px);
  overflow-y:auto;background:#fff;border-radius:16px;padding:28px 24px 22px;text-align:center;
  box-shadow:0 20px 50px rgba(15,23,42,.28);animation:pae-confirm-pop .2s ease}
.pae-confirm__close{position:absolute;top:12px;right:12px;width:32px;height:32px;
  display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:8px;
  background:transparent;color:#94a3b8;font-size:14px;cursor:pointer;
  transition:background .15s ease,color .15s ease}
.pae-confirm__close:hover,.pae-confirm__close:focus{background:#f1f5f9;color:#475569}
.pae-confirm__icon{display:inline-flex;align-items:center;justify-content:center;
  width:64px;height:64px;margin:0 auto 16px;border-radius:50%;background:#fee2e2;color:#dc2626;
  font-size:26px}
.pae-confirm__title{margin:0 0 8px;font-size:17px;font-weight:700;color:#1e293b;line-height:1.35}
.pae-confirm__msg{margin:0;font-size:14px;line-height:1.6;color:#64748b}
.pae-confirm__preview{margin:16px 0 0;padding:12px 14px;border-radius:10px;background:#f8fafc;
  border:1px solid #eef1f8;border-left:3px solid #cbd5e1;text-align:left;font-size:13px;
  line-height:1.6;color:#475569;font-style:italic;max-height:96px;overflow:auto;
  white-space:pre-wrap;word-break:break-word}
.pae-confirm__actions{display:flex;gap:10px;margin-top:22px}
.pae-confirm__btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:0 16px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;
  transition:background .15s ease,box-shadow .15s ease,border-color .15s ease}
.pae-confirm__btn--cancel{border:1px solid #cbd5e1;background:#fff;color:#475569}
.pae-confirm__btn--cancel:hover,.pae-confirm__btn--cancel:focus{background:#f8fafc;border-color:#94a3b8}
.pae-confirm__btn--danger{border:1px solid #dc2626;background:#dc2626;color:#fff}
.pae-confirm__btn--danger:hover,.pae-confirm__btn--danger:focus{background:#b91c1c;border-color:#b91c1c;
  box-shadow:0 4px 12px rgba(220,38,38,.3)}
@keyframes pae-confirm-fade{from{opacity:0}to{opacity:1}}
@keyframes pae-confirm-pop{from{opacity:0;transform:translateY(10px) scale(.97)}
  to{opacity:1;transform:translateY(0) scale(1)}}
@media (max-width:640px){
  .pae-confirm{padding:16px}
  .pae-confirm__dialog{padding:24px 18px 18px;border-radius:14px}
  .pae-confirm__actions{flex-direction:column-reverse}
  .pae-confirm__icon{width:56px;height:56px;font-size:22px}
}

/* ==========================================================================
   mv-cd-* — Course Detail component layer (global, promoted)
   Used by Views/Shared/ViewUi/_ViewCourseDetailsLearnerTemplate.cshtml, shared
   by ClientEmployee AND Student (rendered through _employeeLayout.cshtml and
   _StudentLayout.cshtml respectively). Per the promotion rule in
   DESIGN_STANDARDS_STUDENT.md §2 / DESIGN_STANDARDS_EMPLOYEE.md §2, a
   component used by 2+ roles belongs here, not forked into a role layer
   (`lx-*`/`st-*`) that only one of those layouts loads. Source: tailwind/app.css.
   ========================================================================== */
.mv-cd-app{font-size:15px;line-height:1.5rem;color:rgb(var(--mv-text));background:rgb(var(--mv-bg))}
.mv-cd-app :focus-visible{outline:2px solid rgb(var(--mv-focus));outline-offset:2px;border-radius:4px}
.mv-cd-page{margin-left:auto;margin-right:auto;width:100%;padding:1.25rem 1rem;max-width:1600px}
@media (min-width:640px){.mv-cd-page{padding:1.5rem}}
.mv-cd-stack{display:flex;flex-direction:column;gap:1.5rem}
.mv-cd-stack--tight{gap:1rem}
.mv-cd-stack--loose{gap:2.25rem}

.mv-cd-page-header{display:flex;align-items:center;flex-wrap:wrap;gap:16px;padding:20px 24px;
  border-radius:12px;background:#fff;border:none;border-top:3px solid #6366f1;
  box-shadow:0 1px 3px rgba(0,0,0,.05),0 4px 16px rgba(99,102,241,.07)}
.mv-cd-page-header__icon{display:flex;align-items:center;flex-shrink:0;justify-content:center;
  width:44px;height:44px;border-radius:10px;background:#eef2ff;color:#6366f1}
.mv-cd-page-header__icon>i,.mv-cd-page-header__icon>svg{width:18px;height:18px}
.mv-cd-page-header__text{display:flex;min-width:0;flex:1 1 0%;flex-direction:column;gap:6px}
.mv-cd-page-header__title{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:18px!important;font-weight:700!important;color:#1e293b}
.mv-cd-page-header__crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12px}
.mv-cd-page-header__crumb-link{display:inline-flex;align-items:center;font-weight:500;
  text-decoration-line:none;transition:color .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1);
  gap:4px;color:#6366f1}
.mv-cd-page-header__crumb-link:hover{color:#4f46e5;text-decoration:underline}
.mv-cd-page-header__crumb-link>i,.mv-cd-page-header__crumb-link>svg{width:12px;height:12px}
.mv-cd-page-header__crumb-sep{width:9px;height:9px;color:#cbd5e1}
.mv-cd-page-header__crumb-current{font-weight:500;color:#475569;background:#f1f5f9;border-radius:4px;padding:2px 8px}
.mv-cd-page-header__actions{margin-left:auto;display:flex;flex-wrap:wrap;align-items:center;gap:8px}

.mv-cd-btn-sm{font-size:12px;padding:5px 10px}
.mv-cd-btn-sm svg{height:17px;width:17px}

.mv-cd-hero{display:flex;flex-direction:column;overflow:hidden;border-radius:16px;
  background:rgb(var(--mv-surface));border:1px solid rgb(var(--mv-border));box-shadow:0 18px 50px rgba(15,23,42,.1)}
@media (min-width:768px){.mv-cd-hero{flex-direction:row}}
.mv-cd-hero__media{position:relative;width:100%;flex-shrink:0;overflow:hidden;aspect-ratio:16/9;background:rgb(var(--mv-surface-2))}
@media (min-width:768px){.mv-cd-hero__media{width:320px}}
@media (min-width:1024px){.mv-cd-hero__media{width:380px}}
.mv-cd-hero__media img{height:100%;width:100%;object-fit:cover}
.mv-cd-hero__body{display:flex;flex:1 1 0%;flex-direction:column;gap:12px;padding:20px}
@media (min-width:640px){.mv-cd-hero__body{padding:24px}}
.mv-cd-hero__body--compact{gap:7px;padding:15px 20px}
.mv-cd-hero__title{margin:0;color:rgb(var(--mv-text))}
.mv-cd-hero__desc{font-size:14px;line-height:1.6;color:rgb(var(--mv-text-soft))}
.mv-cd-hero__desc :where(p,ul,ol){margin:0 0 8px}
.mv-cd-hero__desc :where(p,ul,ol):last-child{margin-bottom:0}
.mv-cd-hero__eyebrow{margin:0;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:rgb(var(--mv-text-soft))}
.mv-cd-hero__meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.mv-cd-hero__meta-item{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:rgb(var(--mv-text-soft))}
.mv-cd-hero__meta-item svg{height:15px;width:15px}
.mv-cd-hero__progress{margin:2px 0 4px}
.mv-cd-hero__footer{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding-top:8px}
.mv-cd-hero__price--free{display:inline-flex;align-items:center;border-radius:9999px;font-weight:700;
  gap:6px;padding:6px 12px;font-size:14px;background:rgb(var(--mv-success-soft));color:rgb(var(--mv-success))}
.mv-cd-hero__price--free svg{height:17px;width:17px}

.mv-cd-hero-progress__label{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:12px;font-weight:700;color:#64748b}
.mv-cd-hero-progress__label i{margin-right:5px;color:#6366f1}
.mv-cd-hero-progress__pct{font-size:13px;font-weight:800;color:#1e293b}
.mv-cd-hero-progress__track{position:relative;width:100%;height:7px;border-radius:999px;overflow:hidden;background:#e2e8f0;box-shadow:inset 0 1px 2px rgba(15,23,42,.08)}
.mv-cd-hero-progress__fill{position:absolute;inset:0 auto 0 0;border-radius:999px;
  background:linear-gradient(90deg,#6366f1,#8b5cf6,#ec4899);background-size:200% 100%;
  animation:mv-cd-hero-progress-shimmer 3s ease infinite;transition:width .6s cubic-bezier(.4,0,.2,1)}
@keyframes mv-cd-hero-progress-shimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@media (prefers-reduced-motion:reduce){.mv-cd-hero-progress__fill{animation:none;transition:none}}

.mv-cd-badge{display:inline-flex;align-items:center;gap:4px;border-radius:9999px;padding:4px 10px;
  font-size:10px;font-weight:600;line-height:1;background:rgb(var(--mv-surface-2));color:rgb(var(--mv-text-muted))}
.mv-cd-badge--new{background:#ede9fe;color:#5b38f6}
.mv-cd-badge--overdue{background:rgb(var(--mv-danger-soft));color:rgb(var(--mv-danger))}

.mv-cd-section{display:flex;flex-direction:column;overflow:hidden;border-radius:1rem;
  background:rgb(var(--mv-surface));border:1px solid rgb(var(--mv-border));box-shadow:0 10px 30px rgba(15,23,42,.08)}
.mv-cd-section__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;
  padding:.875rem 1rem;border-bottom:1px solid rgb(var(--mv-border));
  background:linear-gradient(180deg,rgb(var(--mv-surface-2)),rgb(var(--mv-surface)))}
@media (min-width:640px){.mv-cd-section__head{padding-left:1.25rem;padding-right:1.25rem}}
.mv-cd-section__title{display:inline-flex;align-items:center;min-width:0;gap:.625rem;font-size:15px;
  font-weight:700;letter-spacing:-.025em;color:rgb(var(--mv-text))}
.mv-cd-section__icon{display:inline-flex;align-items:center;height:2rem;width:2rem;flex-shrink:0;
  justify-content:center;border-radius:.5rem;font-size:.875rem;line-height:1.25rem;
  background:rgb(var(--mv-info-soft));color:rgb(var(--mv-info))}
.mv-cd-section__icon>i,.mv-cd-section__icon>svg{height:1rem;width:1rem}
.mv-cd-section--brand .mv-cd-section__icon{background:#eff6ff;color:#1f6fe8}
.mv-cd-section--teal .mv-cd-section__icon{background:#ccfbf1;color:#13b8a6}
.mv-cd-section--purple .mv-cd-section__icon{background:#ede9fe;color:#5b38f6}
.mv-cd-section--orange .mv-cd-section__icon{background:#ffedd5;color:#ff7a18}
.mv-cd-section--rose .mv-cd-section__icon{background:#ffe4e6;color:#ef476f}
.mv-cd-section--green .mv-cd-section__icon{background:rgb(var(--mv-success-soft));color:rgb(var(--mv-success))}
@media (prefers-reduced-motion:no-preference){
  .mv-cd-section__icon{transition:transform .2s cubic-bezier(0,0,.2,1)}
  .mv-cd-section:hover .mv-cd-section__icon{transform:translateY(-.125rem) scale(1.1)}
}
.mv-cd-section__count{margin-left:.25rem;border-radius:9999px;padding:.125rem .5rem;font-size:.75rem;
  line-height:1rem;font-weight:600;background:rgb(var(--mv-surface-3));color:rgb(var(--mv-text-muted))}
.mv-cd-section__body{flex:1 1 0%;padding:1rem}
@media (min-width:640px){.mv-cd-section__body{padding:1.25rem}}
.mv-cd-section__body--chips{display:flex;flex-wrap:wrap;gap:8px}
.mv-cd-section--buddies{overflow:visible}
.mv-cd-section--buddies .mv-cd-section__head{border-top-left-radius:inherit;border-top-right-radius:inherit}
.mv-cd-section--buddies .mv-cd-section__body{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}

.mv-cd-detail-label{margin-bottom:8px;font-size:15px;font-weight:700;color:rgb(var(--mv-text))}
.mv-cd-detail-text{margin-bottom:20px;font-size:14px;line-height:1.6;color:rgb(var(--mv-text-soft))}
.mv-cd-detail-text--muted{color:rgb(var(--mv-text-soft))}

.mv-cd-note-card{border-radius:12px;border:1px solid rgb(var(--mv-border));background:rgb(var(--mv-surface));padding:16px}
.mv-cd-note-card+.mv-cd-note-card{margin-top:12px}
.mv-cd-note-card__title{margin:0 0 6px;font-size:14px;font-weight:700;color:rgb(var(--mv-text))}
.mv-cd-note-card__body{margin:0 0 10px;font-size:13px;line-height:1.6;color:rgb(var(--mv-text-soft))}
.mv-cd-note-card__meta{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.mv-cd-note-card__meta-item{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:rgb(var(--mv-text-soft))}
td .mv-cd-note-card__meta-item{padding:2px 0 0 0;line-height:1.1;align-items:flex-start}

.mv-cd-empty{display:flex;align-items:center;justify-content:center;height:100%;flex-direction:column;
  gap:8px;padding:32px 16px;text-align:center}
.mv-cd-empty__icon{display:flex;align-items:center;justify-content:center;margin-bottom:4px;height:48px;
  width:48px;border-radius:9999px;font-size:20px;background:rgb(var(--mv-surface-2));color:rgb(var(--mv-text-soft))}
.mv-cd-empty__title{font-size:14px;font-weight:600;color:rgb(var(--mv-text-muted))}
.mv-cd-empty__text{max-width:384px;font-size:12px;color:rgb(var(--mv-text-soft))}

.mv-cd-chip{display:inline-flex;align-items:baseline;gap:5px;padding:5px 10px;border-radius:10px;
  font-size:13px;font-weight:500;border:1px solid transparent}
.mv-cd-chip--purple{background:linear-gradient(135deg,#ede9fe,#f5f3ff);border-color:rgba(167,139,250,.5);color:#7c3aed}
.mv-cd-chip--teal{background:linear-gradient(135deg,#ccfbf1,#e0f7f5);border-color:rgba(94,234,212,.5);color:#0f766e}

.mv-cd-table-search{width:100%;max-width:260px;height:38px}
@media (min-width:640px){.mv-cd-table-search{width:260px}}