material-inspired-component-library 9.1.0 → 9.1.1

package/dist/stepper.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={603(e,t,r){const n=e=>"willValidate"in e,o=e=>{const t=e.target;n(t)&&t.setCustomValidity("")},i=e=>{const t=e.dataset.miclvalidateMessage||"";if(t&&e.matches("[data-miclvalidate-checkboxes-name]")){const r=e.dataset.miclvalidateCheckboxesName||"",n=e.dataset.miclvalidateCheckboxesCountEqual||"",i=e.dataset.miclvalidateCheckboxesCountMax||"",l=e.dataset.miclvalidateCheckboxesCountMin||"";if(r&&(n||i||l)){const s=e.querySelectorAll(`input[type="checkbox"][name="${r}"]:checked`).length,a=parseInt(n,10),c=parseInt(i,10),d=parseInt(l,10);let m=!isNaN(a)&&s!=a||!isNaN(c)&&s>c||!isNaN(d)&&s<d;e.setCustomValidity(m?t:"");const p=e.querySelector(`input[type="checkbox"][name="${r}"]`);p&&(p.setCustomValidity(m?t:""),m?p.addEventListener("change",o):p.removeEventListener("change",o))}}},l=(e,t)=>{let r=!1;return e.querySelectorAll("fieldset").forEach(i),Array.from(e.elements).forEach(e=>{if(n(e)&&e.willValidate){e.checkValidity()||(r=!0);let o=(e=>{if(!e.parentElement||!n(e))return!1;let t=!1;return e instanceof HTMLInputElement&&"checkbox"===e.type&&e.classList.contains("micl-checkbox")?t=(e=>(e.classList.toggle("micl-checkbox--error",!!e.validationMessage),!1))(e):(e.parentElement.classList.contains("micl-textfield-outlined")||e.parentElement.classList.contains("micl-textfield-filled"))&&(t=((e,t)=>{e.classList.toggle("micl-textfield--error",!!t);const r=e.querySelector(".micl-textfield__supporting-text");return r&&(t?(r.dataset.micltext||(r.dataset.micltext=r.textContent),r.textContent=t):"micltext"in r.dataset&&(r.textContent=r.dataset.micltext||"")),!!t&&!!r})(e.parentElement,e.validationMessage)),t})(e);!o&&t&&e.reportValidity()}}),!r},s={validateFieldSet:(e,t)=>(i(e),l(e,t)),validateForm:(e,t)=>l(e,t)};r.d(t,["default",0,s])},56(e,t,r){const n=globalThis.__miclRegistry??={map:{},rippled:new WeakSet,activated:!1},o=()=>Object.keys(n.map).join(","),i=e=>Object.entries(n.map).find(([t,{type:r}])=>e.matches(t)&&e instanceof r)?.[1],l=e=>{const t=i(e);t&&"function"==typeof t.component.initialize&&t.component.initialize(e)},s=e=>{const t=i(e);t&&"function"==typeof t.component.cleanup&&t.component.cleanup(e)},a=e=>{const t=o();if(!t)return;const r=e.target.closest(t);if(!(r instanceof HTMLElement))return;const n=i(r),l=e.type;n&&"function"==typeof n.component[l]&&n.component[l]?.(e)},c=()=>{n.activated||(n.activated=!0,new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=o();t&&e.matches(t)&&l(e),t&&e.querySelectorAll(t).forEach(l)}}),e.removedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=o();t&&e.matches(t)&&s(e),(e=>{const t=o();t&&e.querySelectorAll(t).forEach(s)})(e)}}))})}).observe(document.body,{childList:!0,subtree:!0}),(e=>{const t=o();t&&e.querySelectorAll(t).forEach(l),e.querySelectorAll('[class*="micl-"], [class*="micl-"] > summary').forEach(e=>{n.rippled.has(e)||"1"===window.getComputedStyle(e).getPropertyValue("--micl-ripple")&&(e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;t.stopPropagation();const r=e.getBoundingClientRect();e.style.setProperty("--micl-x",(t.clientX-r.left)/r.width*100+"%"),e.style.setProperty("--micl-y",(t.clientY-r.top)/r.height*100+"%"),e.classList.remove("micl-rippling"),e.offsetWidth,e.classList.add("micl-rippling");const n=t=>{"micl-ripple"===t.animationName&&(e.classList.remove("micl-rippling"),e.style.removeProperty("--micl-x"),e.style.removeProperty("--micl-y"),e.removeEventListener("animationend",n))};e.addEventListener("animationend",n)}),n.rippled.add(e))}),document.documentElement.style.setProperty("--md-sys-scrollbar-thumb-color",window.getComputedStyle(document.body).getPropertyValue("--md-sys-color-outline").trim())})(document),document.addEventListener("change",a),document.addEventListener("input",a),document.addEventListener("keydown",a))},d=()=>{document.removeEventListener("DOMContentLoaded",d),c()};"loading"!==document.readyState?c():document.addEventListener("DOMContentLoaded",d),r.d(t,["register",0,(e,t,r)=>(n.map[e]={component:t,type:r},n.activated&&document.querySelectorAll(e).forEach(l),t)])}};const t={};function r(n){const o=t[n];if(void 0!==o)return o.exports;const i=t[n]={exports:{}};return e[n](i,i.exports,r),i.exports}r.d=(e,t)=>{if(Array.isArray(t))for(var n=0;n<t.length;){var o=t[n++],i=t[n++];r.o(e,o)?0===i&&n++:0===i?Object.defineProperty(e,o,{enumerable:!0,value:t[n++]}):Object.defineProperty(e,o,{enumerable:!0,get:i})}else for(var o in t)r.o(t,o)&&!r.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};let n={};r.r(n);var o=r(603),i=r(56);const l=".micl-stepper",s=".micl-stepper__action-back,.micl-stepper__action-next",a=".micl-stepper__header button[role=tab][aria-controls]",c="micl-stepper__step",d="."+c,m=e=>e.querySelector(`${d}[aria-current=step]`)||u(e,e.querySelector(d)),p=(e,t)=>Array.from(e.querySelectorAll(d)).indexOf(t)+1,u=(e,t)=>{if(!t)return null;let r=0;e.querySelectorAll(d).forEach((e,n)=>{e.setAttribute("aria-current",e===t?"step":"false"),e===t&&(r=n)});const n=e.querySelectorAll(a).item(r);return e.querySelectorAll(a).forEach(e=>{e.setAttribute("aria-selected",e===n?"true":"false")}),g(e,t),t},f=e=>{const t=e.currentTarget;"transform"===e.propertyName&&t&&(t.classList.remove("micl-stepper__step--fromselected","micl-stepper__step--toselected"),t.removeEventListener("transitionend",f))},y=e=>e.classList.contains("micl-stepper__action-back"),g=(e,t)=>{((e,t)=>{Array.from(e.querySelectorAll(s)).forEach(e=>{const r=y(e)?"previousElementSibling":"nextElementSibling",n=t[r]?.classList.contains(c);e.classList.toggle("micl-stepper__action--hidden",!n)})})(e,t),((e,t)=>{const r=e.querySelectorAll(d).length,n=p(e,t);e.querySelectorAll("[data-step]").forEach(e=>{const t=parseInt(e.dataset.step||"0",10);e.classList.toggle("micl-stepper__step--hidden",t>0?t!=n:r+t+1!=n)})})(e,t),((e,t)=>{const r=p(e,t),n=e.querySelectorAll(d).length,o=!e.classList.contains("micl-stepper--nonlinear"),i=(t,r)=>{e.querySelectorAll(t).forEach(e=>{e.textContent=r})};i(".micl-stepper__progress-current",`${r}`),i(".micl-stepper__progress-total",`${n}`),e.querySelectorAll(".micl-stepper__progress-dots").forEach(e=>{const t=document.createDocumentFragment();e.innerHTML="";for(let e=1;e<=n;e++){let n=document.createElement("span");n.classList.add("micl-stepper__progress-dot"),(o&&e<=r||!o&&e===r)&&n.classList.add("micl-stepper__progress--done"),t.appendChild(n)}e.appendChild(t)}),e.querySelectorAll(a).forEach((e,t)=>{e.classList.toggle("micl-stepper__progress--done",o?t+1<=r:t+1===r)})})(e,t)},h=(0,i.register)(l,{initialize:e=>{if(!e.matches(l)||e.dataset.miclinitialized)return;e.dataset.miclinitialized="1";const t=m(e),r=e.querySelector(".micl-stepper__header");t&&(g(e,t),r?.querySelectorAll("button[role=tab][aria-controls]").forEach((t,r)=>{t.style.setProperty("--micl-stepper-anchor",`--micl-step-${r}`),r>0&&t.style.setProperty("--micl-stepper-prev","--micl-step-"+(r-1)),t.addEventListener("click",()=>{if("ariaControlsElements"in Element.prototype&&t.ariaControlsElements)u(e,t.ariaControlsElements[0]);else{const r=t.getAttribute("aria-controls");r&&u(e,document.getElementById(r))}})})),Array.from(e.querySelectorAll(s)).forEach(t=>{t.addEventListener("click",function(t){const r=y(this),n=m(e);if(!n||!r&&n instanceof HTMLFieldSetElement&&!o.default.validateFieldSet(n,!0))return void(r||t.stopImmediatePropagation());const i=n[r?"previousElementSibling":"nextElementSibling"];i?.classList.contains(c)&&((e,t,r)=>{t.addEventListener("transitionend",f),t.classList.add("micl-stepper__step--fromselected"),t.offsetHeight,r.addEventListener("transitionend",f),r.classList.add("micl-stepper__step--toselected"),r.offsetHeight,u(e,r)})(e,n,i)},!0)}),e instanceof HTMLFormElement&&e.addEventListener("submit",t=>{t.submitter?.classList.contains("micl-form--dosubmit")||t.preventDefault(),o.default.validateForm(e,!0)||t.stopImmediatePropagation()},!0)}},HTMLElement);return r.d(n,["default",0,h,"stepperSelector",0,l]),n})());
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.micl=t():e.micl=t()}(self,()=>(()=>{"use strict";var e={603(e,t,r){const n=e=>"willValidate"in e,o=e=>{const t=e.target;n(t)&&t.setCustomValidity("")},i=e=>{const t=e.dataset.miclvalidateMessage||"";if(t&&e.matches("[data-miclvalidate-checkboxes-name]")){const r=e.dataset.miclvalidateCheckboxesName||"",n=e.dataset.miclvalidateCheckboxesCountEqual||"",i=e.dataset.miclvalidateCheckboxesCountMax||"",l=e.dataset.miclvalidateCheckboxesCountMin||"";if(r&&(n||i||l)){const s=e.querySelectorAll(`input[type="checkbox"][name="${r}"]:checked`).length,a=parseInt(n,10),c=parseInt(i,10),d=parseInt(l,10);let m=!isNaN(a)&&s!=a||!isNaN(c)&&s>c||!isNaN(d)&&s<d;e.setCustomValidity(m?t:"");const p=e.querySelector(`input[type="checkbox"][name="${r}"]`);p&&(p.setCustomValidity(m?t:""),m?p.addEventListener("change",o):p.removeEventListener("change",o))}}},l=(e,t)=>{let r=!1;return e.querySelectorAll("fieldset").forEach(i),Array.from(e.elements).forEach(e=>{if(n(e)&&e.willValidate){e.checkValidity()||(r=!0);let o=(e=>{if(!e.parentElement||!n(e))return!1;let t=!1;return e instanceof HTMLInputElement&&"checkbox"===e.type&&e.classList.contains("micl-checkbox")?t=(e=>(e.classList.toggle("micl-checkbox--error",!!e.validationMessage),!1))(e):(e.parentElement.classList.contains("micl-textfield-outlined")||e.parentElement.classList.contains("micl-textfield-filled"))&&(t=((e,t)=>{e.classList.toggle("micl-textfield--error",!!t);const r=e.querySelector(".micl-textfield__supporting-text");return r&&(t?("micltext"in r.dataset||(r.dataset.micltext=r.textContent),r.textContent=t):"micltext"in r.dataset&&(r.textContent=r.dataset.micltext||"")),!!t&&!!r})(e.parentElement,e.validationMessage)),t})(e);!o&&t&&e.reportValidity()}}),!r},s={validateFieldSet:(e,t)=>(i(e),l(e,t)),validateForm:(e,t)=>l(e,t)};r.d(t,["default",0,s])},56(e,t,r){const n=globalThis.__miclRegistry??={map:{},rippled:new WeakSet,activated:!1},o=()=>Object.keys(n.map).join(","),i=e=>Object.entries(n.map).find(([t,{type:r}])=>e.matches(t)&&e instanceof r)?.[1],l=e=>{const t=i(e);t&&"function"==typeof t.component.initialize&&t.component.initialize(e)},s=e=>{const t=i(e);t&&"function"==typeof t.component.cleanup&&t.component.cleanup(e)},a=e=>{const t=o();if(!t)return;const r=e.target.closest(t);if(!(r instanceof HTMLElement))return;const n=i(r),l=e.type;n&&"function"==typeof n.component[l]&&n.component[l]?.(e)},c=()=>{n.activated||(n.activated=!0,new MutationObserver(e=>{e.forEach(e=>{"childList"===e.type&&(e.addedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=o();t&&e.matches(t)&&l(e),t&&e.querySelectorAll(t).forEach(l)}}),e.removedNodes.forEach(e=>{if(e instanceof HTMLElement){const t=o();t&&e.matches(t)&&s(e),(e=>{const t=o();t&&e.querySelectorAll(t).forEach(s)})(e)}}))})}).observe(document.body,{childList:!0,subtree:!0}),(e=>{const t=o();t&&e.querySelectorAll(t).forEach(l),e.querySelectorAll('[class*="micl-"], [class*="micl-"] > summary').forEach(e=>{n.rippled.has(e)||"1"===window.getComputedStyle(e).getPropertyValue("--micl-ripple")&&(e.addEventListener("pointerdown",t=>{if(t.currentTarget.classList.contains("micl-card--nonactionable"))return;t.stopPropagation();const r=e.getBoundingClientRect();e.style.setProperty("--micl-x",(t.clientX-r.left)/r.width*100+"%"),e.style.setProperty("--micl-y",(t.clientY-r.top)/r.height*100+"%"),e.classList.remove("micl-rippling"),e.offsetWidth,e.classList.add("micl-rippling");const n=t=>{"micl-ripple"===t.animationName&&(e.classList.remove("micl-rippling"),e.style.removeProperty("--micl-x"),e.style.removeProperty("--micl-y"),e.removeEventListener("animationend",n))};e.addEventListener("animationend",n)}),n.rippled.add(e))}),document.documentElement.style.setProperty("--md-sys-scrollbar-thumb-color",window.getComputedStyle(document.body).getPropertyValue("--md-sys-color-outline").trim())})(document),document.addEventListener("change",a),document.addEventListener("input",a),document.addEventListener("keydown",a))},d=()=>{document.removeEventListener("DOMContentLoaded",d),c()};"loading"!==document.readyState?c():document.addEventListener("DOMContentLoaded",d),r.d(t,["register",0,(e,t,r)=>(n.map[e]={component:t,type:r},n.activated&&document.querySelectorAll(e).forEach(l),t)])}};const t={};function r(n){const o=t[n];if(void 0!==o)return o.exports;const i=t[n]={exports:{}};return e[n](i,i.exports,r),i.exports}r.d=(e,t)=>{if(Array.isArray(t))for(var n=0;n<t.length;){var o=t[n++],i=t[n++];r.o(e,o)?0===i&&n++:0===i?Object.defineProperty(e,o,{enumerable:!0,value:t[n++]}):Object.defineProperty(e,o,{enumerable:!0,get:i})}else for(var o in t)r.o(t,o)&&!r.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};let n={};r.r(n);var o=r(603),i=r(56);const l=".micl-stepper",s=".micl-stepper__action-back,.micl-stepper__action-next",a=".micl-stepper__header button[role=tab][aria-controls]",c="micl-stepper__step",d="."+c,m=e=>e.querySelector(`${d}[aria-current=step]`)||u(e,e.querySelector(d)),p=(e,t)=>Array.from(e.querySelectorAll(d)).indexOf(t)+1,u=(e,t)=>{if(!t)return null;let r=0;e.querySelectorAll(d).forEach((e,n)=>{e.setAttribute("aria-current",e===t?"step":"false"),e===t&&(r=n)});const n=e.querySelectorAll(a).item(r);return e.querySelectorAll(a).forEach(e=>{e.setAttribute("aria-selected",e===n?"true":"false")}),g(e,t),t},f=e=>{const t=e.currentTarget;"transform"===e.propertyName&&t&&(t.classList.remove("micl-stepper__step--fromselected","micl-stepper__step--toselected"),t.removeEventListener("transitionend",f))},y=e=>e.classList.contains("micl-stepper__action-back"),g=(e,t)=>{((e,t)=>{Array.from(e.querySelectorAll(s)).forEach(e=>{const r=y(e)?"previousElementSibling":"nextElementSibling",n=t[r]?.classList.contains(c);e.classList.toggle("micl-stepper__action--hidden",!n)})})(e,t),((e,t)=>{const r=e.querySelectorAll(d).length,n=p(e,t);e.querySelectorAll("[data-step]").forEach(e=>{const t=parseInt(e.dataset.step||"0",10);e.classList.toggle("micl-stepper__step--hidden",t>0?t!=n:r+t+1!=n)})})(e,t),((e,t)=>{const r=p(e,t),n=e.querySelectorAll(d).length,o=!e.classList.contains("micl-stepper--nonlinear"),i=(t,r)=>{e.querySelectorAll(t).forEach(e=>{e.textContent=r})};i(".micl-stepper__progress-current",`${r}`),i(".micl-stepper__progress-total",`${n}`),e.querySelectorAll(".micl-stepper__progress-dots").forEach(e=>{const t=document.createDocumentFragment();e.innerHTML="";for(let e=1;e<=n;e++){let n=document.createElement("span");n.classList.add("micl-stepper__progress-dot"),(o&&e<=r||!o&&e===r)&&n.classList.add("micl-stepper__progress--done"),t.appendChild(n)}e.appendChild(t)}),e.querySelectorAll(a).forEach((e,t)=>{e.classList.toggle("micl-stepper__progress--done",o?t+1<=r:t+1===r)})})(e,t)},h=(0,i.register)(l,{initialize:e=>{if(!e.matches(l)||e.dataset.miclinitialized)return;e.dataset.miclinitialized="1";const t=m(e),r=e.querySelector(".micl-stepper__header");t&&(g(e,t),r?.querySelectorAll("button[role=tab][aria-controls]").forEach((t,r)=>{t.style.setProperty("--micl-stepper-anchor",`--micl-step-${r}`),r>0&&t.style.setProperty("--micl-stepper-prev","--micl-step-"+(r-1)),t.addEventListener("click",()=>{if("ariaControlsElements"in Element.prototype&&t.ariaControlsElements)u(e,t.ariaControlsElements[0]);else{const r=t.getAttribute("aria-controls");r&&u(e,document.getElementById(r))}})})),Array.from(e.querySelectorAll(s)).forEach(t=>{t.addEventListener("click",function(t){const r=y(this),n=m(e);if(!n||!r&&n instanceof HTMLFieldSetElement&&!o.default.validateFieldSet(n,!0))return void(r||t.stopImmediatePropagation());const i=n[r?"previousElementSibling":"nextElementSibling"];i?.classList.contains(c)&&((e,t,r)=>{t.addEventListener("transitionend",f),t.classList.add("micl-stepper__step--fromselected"),t.offsetHeight,r.addEventListener("transitionend",f),r.classList.add("micl-stepper__step--toselected"),r.offsetHeight,u(e,r)})(e,n,i)},!0)}),e instanceof HTMLFormElement&&e.addEventListener("submit",t=>{t.submitter?.classList.contains("micl-form--dosubmit")||t.preventDefault(),o.default.validateForm(e,!0)||t.stopImmediatePropagation()},!0)}},HTMLElement);return r.d(n,["default",0,h,"stepperSelector",0,l]),n})());

package/dist/switch.css

@@ -1 +1 @@
-:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}input[type=checkbox].micl-switch:not(:disabled)+label,label:has(+input[type=checkbox].micl-switch:not(:disabled)){-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer}input[type=checkbox].micl-switch+label,label:has(+input[type=checkbox].micl-switch){color:var(--md-sys-color-on-surface)}input[type=checkbox].micl-switch:disabled+label,label:has(+input[type=checkbox].micl-switch:disabled){opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%)}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-layer-size: 40px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}input[type=checkbox].micl-switch{--md-comp-switch-unselected-icon: "+";--md-comp-switch-selected-icon: "\AC";--md-comp-switch-motion-effects: cubic-bezier(0.34, 0.88, 0.34, 1);--md-comp-switch-motion-duration: 300ms;--_track-width: var(--md-comp-switch-track-width, 52px);--_track-height: var(--md-comp-switch-track-height, 32px);--_track-outline-width: var(--md-comp-switch-track-outline-width, 2px);--_handle-size: var(--md-comp-switch-handle-size, 16px);--_handle-selected-size: var(--md-comp-switch-selected-handle-size, 24px);--_handle-pressed-size: var(--md-comp-switch-pressed-handle-size, 28px);--_layer: var(--md-sys-state-layer-size, 40px);--_target: var(--md-sys-target-size, 48px);appearance:none;position:relative;inline-size:var(--_track-width);block-size:var(--_target);margin:0;border-radius:calc(var(--_track-height)/2);outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=checkbox].micl-switch::before{content:"";box-sizing:border-box;display:block;inline-size:var(--_track-width);block-size:var(--_track-height);margin-block:calc((var(--_target) - var(--_track-height))/2);border:var(--_track-outline-width) solid var(--md-comp-switch-unselected-track-outline-color, var(--md-sys-color-outline));border-radius:inherit;background-color:var(--md-comp-switch-unselected-track-color, var(--md-sys-color-surface-container-highest));transition:background-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch::after{content:var(--md-comp-switch-unselected-icon);box-sizing:border-box;position:absolute;inline-size:var(--_layer);block-size:var(--_layer);inset:0;inset-inline-start:calc((var(--_target) - var(--_layer) - 16px)/2);margin:auto 0;font:300 16px/16px var(--md-ref-typeface-plain);color:var(--md-comp-switch-unselected-icon-color, var(--md-sys-color-surface-container-highest));text-align:center;background-color:var(--md-comp-switch-unselected-handle-color, var(--md-sys-color-outline));background-clip:content-box;border:calc((var(--_layer) - var(--_handle-size))/2) solid rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);transform:rotate(135deg);transition:inset-inline-start var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),border-width var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),line-height var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),border-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),background-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch:checked::before{background-color:var(--md-comp-switch-selected-track-color, var(--md-sys-color-primary))}input[type=checkbox].micl-switch:checked::after{content:var(--md-comp-switch-selected-icon);inset-inline-start:calc(var(--_track-width) - (var(--_layer) + var(--_target) - 16px)/2);font-size:25.6px;line-height:20.8px;letter-spacing:1.6px;border:calc((var(--_layer) - var(--_handle-selected-size))/2) solid rgba(0,0,0,0);color:var(--md-comp-switch-selected-icon-color, var(--md-sys-color-on-primary-container));background-color:var(--md-comp-switch-selected-handle-color, var(--md-sys-color-on-primary))}input[type=checkbox].micl-switch:not(:disabled){cursor:pointer}input[type=checkbox].micl-switch:not(:disabled):hover::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):hover:checked::after{border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):focus-visible::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:not(:disabled):focus-visible::before{outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-sys-color-secondary);outline-offset:2px}input[type=checkbox].micl-switch:not(:disabled):focus-visible:checked::after{border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):focus-visible:not(:checked)::after{background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):active::after{line-height:27.2px;border:calc((var(--_layer) - var(--_handle-pressed-size))/2) solid rgba(0,0,0,0);background-color:var(--md-sys-color-on-surface-variant)}input[type=checkbox].micl-switch:not(:disabled):active:checked::after{line-height:25.6px;border-width:calc((var(--_layer) - var(--_handle-pressed-size))/2);border-color:color-mix(in srgb, var(--md-sys-color-primary) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent);background-color:var(--md-sys-color-primary-container)}input[type=checkbox].micl-switch:not(:disabled):active:not(:checked)::after{border-color:color-mix(in srgb, var(--md-sys-color-on-surface) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:disabled::before{border-color:var(--md-sys-color-on-surface);background-color:var(--md-sys-color-surface-container-highest);opacity:12%}input[type=checkbox].micl-switch:disabled:checked::before{background-color:var(--md-sys-color-on-surface)}input[type=checkbox].micl-switch:disabled::after{color:rgb(from var(--md-sys-color-surface-container-highest) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));background-color:var(--md-sys-color-on-surface);opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%)}input[type=checkbox].micl-switch:disabled:checked::after{color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));background-color:var(--md-sys-color-surface);opacity:100%}input[type=checkbox].micl-switch:dir(rtl)::after{transform:rotate(45deg) scaleY(-1)}
+input[type=checkbox].micl-switch:not(:disabled)+label,label:has(+input[type=checkbox].micl-switch:not(:disabled)),label:has(input[type=checkbox].micl-switch:not(:disabled)){cursor:pointer}input[type=checkbox].micl-switch+label,label:has(+input[type=checkbox].micl-switch),label:has(input[type=checkbox].micl-switch){color:var(--md-sys-color-on-surface);-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=checkbox].micl-switch:disabled+label,label:has(+input[type=checkbox].micl-switch:disabled){opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%)}label:has(input[type=checkbox].micl-switch:disabled){color:rgb(from var(--md-sys-color-on-surface) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%))}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-layer-size: 40px}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-disabled-state-layer-opacity: 38%}:root{--md-sys-state-focus-indicator-thickness: 3px}:root{--md-sys-state-focus-indicator-outer-offset: 2px}input[type=checkbox].micl-switch{--md-comp-switch-unselected-icon: "+";--md-comp-switch-selected-icon: "\AC";--md-comp-switch-motion-effects: cubic-bezier(0.34, 0.88, 0.34, 1);--md-comp-switch-motion-duration: 300ms;--_track-width: var(--md-comp-switch-track-width, 52px);--_track-height: var(--md-comp-switch-track-height, 32px);--_track-outline-width: var(--md-comp-switch-track-outline-width, 2px);--_handle-size: var(--md-comp-switch-handle-size, 16px);--_handle-selected-size: var(--md-comp-switch-selected-handle-size, 24px);--_handle-pressed-size: var(--md-comp-switch-pressed-handle-size, 28px);--_layer: var(--md-sys-state-layer-size, 40px);--_target: var(--md-sys-state-target-size, 48px);--_unselected-layer-color: var(--md-comp-switch-unselected-state-layer-color, var(--md-sys-color-on-surface));--_selected-layer-color: var(--md-comp-switch-selected-state-layer-color, var(--md-sys-color-primary));appearance:none;position:relative;inline-size:var(--_track-width);block-size:var(--_target);margin:0;border-radius:calc(var(--_track-height)/2);outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}input[type=checkbox].micl-switch::before{content:"";box-sizing:border-box;display:block;inline-size:var(--_track-width);block-size:var(--_track-height);margin-block:calc((var(--_target) - var(--_track-height))/2);border:var(--_track-outline-width) solid var(--md-comp-switch-unselected-track-outline-color, var(--md-sys-color-outline));border-radius:inherit;background-color:var(--md-comp-switch-unselected-track-color, var(--md-sys-color-surface-container-highest));transition:background-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch::after{content:var(--md-comp-switch-unselected-icon);box-sizing:border-box;position:absolute;display:grid;grid-template-rows:auto 3px;place-items:center;inline-size:var(--_layer);block-size:var(--_layer);inset:0;inset-inline-start:calc((var(--_track-height) - var(--_layer))/2);margin:auto 0;font:300 18px/0 var(--md-ref-typeface-plain);color:var(--md-comp-switch-unselected-icon-color, var(--md-sys-color-surface-container-highest));background-color:var(--md-comp-switch-unselected-handle-color, var(--md-sys-color-outline));background-clip:content-box;border:calc((var(--_layer) - var(--_handle-size))/2) solid rgba(0,0,0,0);border-radius:var(--md-sys-shape-corner-full);transform:rotate(135deg);transition:inset-inline-start var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),border-width var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),grid-template-rows var(--md-comp-switch-motion-duration) var(--md-comp-switch-motion-effects),color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),border-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1),background-color var(--md-comp-switch-motion-duration) cubic-bezier(0.2, 0, 0, 1)}input[type=checkbox].micl-switch:checked::before{border-color:var(--md-comp-switch-selected-track-color, var(--md-sys-color-primary));background-color:var(--md-comp-switch-selected-track-color, var(--md-sys-color-primary))}input[type=checkbox].micl-switch:checked::after{content:var(--md-comp-switch-selected-icon);grid-template-rows:auto 8px;inset-inline-start:calc(var(--_track-width) - (var(--_layer) + var(--_track-height))/2);font-size:32px;letter-spacing:1.6px;border:calc((var(--_layer) - var(--_handle-selected-size))/2) solid rgba(0,0,0,0);color:var(--md-comp-switch-selected-icon-color, var(--md-sys-color-on-primary-container));background-color:var(--md-comp-switch-selected-handle-color, var(--md-sys-color-on-primary))}input[type=checkbox].micl-switch:not(:disabled){cursor:pointer}input[type=checkbox].micl-switch:not(:disabled):hover::after{border-color:color-mix(in srgb, var(--_unselected-layer-color) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-comp-switch-unselected-hover-handle-color, var(--md-sys-color-on-surface-variant))}input[type=checkbox].micl-switch:not(:disabled):hover:checked::after{border-color:color-mix(in srgb, var(--_selected-layer-color) var(--md-sys-state-hover-state-layer-opacity, 8%), transparent);background-color:var(--md-comp-switch-selected-hover-handle-color, var(--md-sys-color-primary-container))}input[type=checkbox].micl-switch:not(:disabled):focus-visible::after{border-color:color-mix(in srgb, var(--_unselected-layer-color) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:not(:disabled):focus-visible::before{outline:var(--md-sys-state-focus-indicator-thickness, 3px) solid var(--md-comp-switch-focus-indicator-color, var(--md-sys-color-secondary));outline-offset:var(--md-sys-state-focus-indicator-outer-offset, 2px)}input[type=checkbox].micl-switch:not(:disabled):focus-visible:checked::after{border-color:color-mix(in srgb, var(--_selected-layer-color) var(--md-sys-state-focus-state-layer-opacity, 10%), transparent);background-color:var(--md-comp-switch-selected-focus-handle-color, var(--md-sys-color-primary-container))}input[type=checkbox].micl-switch:not(:disabled):focus-visible:not(:checked)::after{background-color:var(--md-comp-switch-unselected-focus-handle-color, var(--md-sys-color-on-surface-variant))}input[type=checkbox].micl-switch:not(:disabled):active::after{border:calc((var(--_layer) - var(--_handle-pressed-size))/2) solid rgba(0,0,0,0);background-color:var(--md-comp-switch-unselected-pressed-handle-color, var(--md-sys-color-on-surface-variant))}input[type=checkbox].micl-switch:not(:disabled):active:checked::after{border-width:calc((var(--_layer) - var(--_handle-pressed-size))/2);border-color:color-mix(in srgb, var(--_selected-layer-color) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent);background-color:var(--md-comp-switch-selected-pressed-handle-color, var(--md-sys-color-primary-container))}input[type=checkbox].micl-switch:not(:disabled):active:not(:checked)::after{border-color:color-mix(in srgb, var(--_unselected-layer-color) var(--md-sys-state-pressed-state-layer-opacity, 10%), transparent)}input[type=checkbox].micl-switch:disabled::before{border-color:var(--md-comp-switch-disabled-unselected-track-outline-color, var(--md-sys-color-on-surface));background-color:var(--md-comp-switch-disabled-unselected-track-color, var(--md-sys-color-surface-container-highest));opacity:var(--md-comp-switch-disabled-track-opacity, 12%)}input[type=checkbox].micl-switch:disabled:checked::before{border-color:var(--md-comp-switch-disabled-selected-track-color, var(--md-sys-color-on-surface));background-color:var(--md-comp-switch-disabled-selected-track-color, var(--md-sys-color-on-surface))}input[type=checkbox].micl-switch:disabled::after{color:var(--md-comp-switch-disabled-unselected-icon-color, var(--md-sys-color-surface-container-highest));background-color:var(--md-comp-switch-disabled-unselected-handle-color, var(--md-sys-color-on-surface));opacity:var(--md-sys-state-disabled-state-layer-opacity, 38%)}input[type=checkbox].micl-switch:disabled:checked::after{color:rgb(from var(--md-comp-switch-disabled-selected-icon-color, var(--md-sys-color-on-surface)) r g b/var(--md-sys-state-disabled-state-layer-opacity, 38%));background-color:var(--md-comp-switch-disabled-selected-handle-color, var(--md-sys-color-surface));opacity:100%}input[type=checkbox].micl-switch:dir(rtl)::after{transform:rotate(45deg) scaleY(-1)}

package/dist/timepicker.css

@@ -1 +1 @@
-:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-focus-indicator-thickness: 3px}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.0125rem}:root{--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem}:root{--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem}.micl-timepicker__period .micl-timepicker__am,.micl-timepicker__period .micl-timepicker__pm,.micl-timepicker input[name=hour],.micl-timepicker input[name=minute]{--statelayer-color: currentColor;background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:--statelayer-opacity var(--md-comp-time-picker-motion-duration) linear}.micl-timepicker__period .micl-timepicker__am:hover,.micl-timepicker__period .micl-timepicker__pm:hover,.micl-timepicker input[name=hour]:hover,.micl-timepicker input[name=minute]:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}.micl-timepicker__period .micl-timepicker__am:focus-visible,.micl-timepicker__period .micl-timepicker__pm:focus-visible,.micl-timepicker input[name=hour]:focus-visible,.micl-timepicker input[name=minute]:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity)}.micl-timepicker__period .micl-timepicker__am:active,.micl-timepicker__period .micl-timepicker__pm:active,.micl-timepicker input[name=hour]:active,.micl-timepicker input[name=minute]:active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity)}dialog.micl-dialog.micl-timepicker{--md-comp-time-picker-motion-duration: 350ms;--_input-height: var(--md-comp-time-picker-time-selector-container-height, 72px);--_input-width: var(--md-comp-time-picker-time-selector-container-width, 96px);--_separator-width: var(--md-comp-time-picker-separator-width, 24px);--_period-height: var(--md-comp-time-picker-period-selector-container-height, 72px);--_period-width: var(--md-comp-time-picker-period-selector-container-width, 52px);--_dial-size: var(--md-comp-time-picker-clock-dial-container-size, 256px);--_center-size: var(--md-comp-time-picker-clock-dial-selector-center-container-size, 8px);--_track-width: var(--md-comp-time-picker-clock-dial-selector-track-container-width, 2px);--_target: var(--md-sys-target-size, 48px)}dialog.micl-dialog.micl-timepicker .micl-dialog__headline{padding-block-end:20px}dialog.micl-dialog.micl-timepicker .micl-dialog__headline h2{font:var(--md-sys-typescale-label-medium-weight) var(--md-sys-typescale-label-medium-size)/var(--md-sys-typescale-label-medium-line-height) var(--md-sys-typescale-label-medium-font);letter-spacing:var(--md-sys-typescale-label-medium-tracking);color:var(--md-comp-time-picker-headline-color, var(--md-sys-color-on-surface-variant))}dialog.micl-dialog.micl-timepicker .micl-dialog__content{display:grid;padding-block-start:1px;grid-template-areas:"hr sep min per" "hsup hsup msup msup" "dial dial dial dial";grid-template-columns:auto var(--_separator-width) var(--_input-width) auto}dialog.micl-dialog.micl-timepicker .micl-dialog__actions:has(.micl-timepicker__inputmode){justify-content:space-between}dialog.micl-dialog.micl-timepicker .micl-dialog__actions .micl-timepicker__inputmode{margin-inline-start:-8px}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)){--_input-height: var(--md-comp-time-picker-time-selector-container-height, 80px);--_period-height: var(--md-comp-time-picker-period-selector-container-height, 80px)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal{--_period-height: var(--md-comp-time-picker-period-selector-container-height, 38px)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__headline{padding-block-end:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content{grid-template-areas:"x x x dial" "hr sep min dial" "per per per dial";grid-template-rows:72px var(--_input-height) auto}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period{--_ampm-height: var(--_period-height);--_period-width: calc(2 * var(--_input-width) + var(--_separator-width));display:flex;align-self:flex-start;margin-inline:0;margin-block:16px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__am{border-start-end-radius:0;border-end-start-radius:var(--md-sys-shape-corner-small)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__pm{border-block-start-width:1px;border-inline-start-width:0px;border-start-end-radius:var(--md-sys-shape-corner-small);border-end-start-radius:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__dial{margin-block:0;margin-inline:40px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) .micl-timepicker__supporting-text-hour,dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) .micl-timepicker__supporting-text-minute{display:none}.micl-timepicker input[name=hour],.micl-timepicker input[name=minute]{font:var(--md-sys-typescale-display-medium-weight) var(--md-sys-typescale-display-medium-size)/var(--md-sys-typescale-display-medium-line-height) var(--md-sys-typescale-display-medium-font);letter-spacing:var(--md-sys-typescale-display-medium-tracking);box-sizing:border-box;inline-size:var(--_input-width);block-size:var(--_input-height);margin:0;padding:0;border:none;outline:none;border-radius:var(--md-sys-shape-corner-small);background-color:var(--md-comp-time-picker-time-selector-unselected-container-color, var(--md-sys-color-surface-container-highest));color:var(--md-comp-time-picker-time-selector-unselected-label-text-color, var(--md-sys-color-on-surface));text-align:center;user-select:none;-moz-appearance:textfield}.micl-timepicker input[name=hour]::-webkit-inner-spin-button,.micl-timepicker input[name=hour]::-webkit-outer-spin-button,.micl-timepicker input[name=minute]::-webkit-inner-spin-button,.micl-timepicker input[name=minute]::-webkit-outer-spin-button{-webkit-appearance:none}.micl-timepicker input[name=hour]::selection,.micl-timepicker input[name=minute]::selection{background-color:rgba(0,0,0,0)}.micl-timepicker input[name=hour].micl-timepicker--selected,.micl-timepicker input[name=minute].micl-timepicker--selected{background-color:var(--md-comp-time-picker-time-selector-selected-container-color, var(--md-sys-color-primary-container));color:var(--md-comp-time-picker-time-selector-selected-label-text-color, var(--md-sys-color-on-primary-container));border:2px solid var(--md-comp-time-input-focus-outline-color, var(--md-sys-color-primary))}.micl-timepicker input[name=hour]{grid-area:hr;justify-self:flex-end}.micl-timepicker input[name=minute]{grid-area:min}.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) input[name=hour],.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) input[name=minute]{font:var(--md-sys-typescale-display-large-weight) var(--md-sys-typescale-display-large-size)/var(--md-sys-typescale-display-large-line-height) var(--md-sys-typescale-display-large-font);letter-spacing:var(--md-sys-typescale-display-large-tracking);border:none;cursor:pointer}.micl-timepicker:not(:has(.micl-timepicker__am)):not(:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden))){--_input-width: var(--md-comp-time-picker-time-selector-24h-container-width, 114px)}.micl-timepicker__separator{font:var(--md-sys-typescale-display-large-weight) var(--md-sys-typescale-display-large-size)/var(--md-sys-typescale-display-large-line-height) var(--md-sys-typescale-display-large-font);letter-spacing:var(--md-sys-typescale-display-large-tracking);grid-area:sep;block-size:var(--_input-height);line-height:var(--_input-height);inline-size:var(--_separator-width);text-align:center;color:var(--md-comp-time-picker-separator-color, var(--md-sys-color-on-surface))}.micl-timepicker__period{--_ampm-height: calc(var(--_period-height) / 2);grid-area:per;block-size:var(--_period-height);inline-size:0}.micl-timepicker__period:has(.micl-timepicker__am){inline-size:var(--_period-width);margin-inline:12px 0}.micl-timepicker__period .micl-timepicker__am,.micl-timepicker__period .micl-timepicker__pm{font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking);appearance:none;box-sizing:border-box;position:relative;display:flex;align-items:center;inline-size:var(--_period-width);block-size:var(--_ampm-height);min-block-size:var(--_ampm-height);margin:0;border:1px solid var(--md-comp-time-picker-period-selector-outline-color, var(--md-sys-color-outline));outline:none;color:var(--md-comp-time-picker-period-selector-unselected-label-text-color, var(--md-sys-color-on-surface-variant));background-color:rgba(0,0,0,0);cursor:pointer}.micl-timepicker__period .micl-timepicker__am::before,.micl-timepicker__period .micl-timepicker__pm::before{content:"AM";position:absolute;inline-size:100%;text-align:center}.micl-timepicker__period .micl-timepicker__am:checked,.micl-timepicker__period .micl-timepicker__pm:checked{color:var(--md-comp-time-picker-period-selector-selected-label-text-color, var(--md-sys-color-on-tertiary-container));background-color:var(--md-comp-time-picker-period-selector-selected-container-color, var(--md-sys-color-tertiary-container))}.micl-timepicker__period .micl-timepicker__am:focus-visible,.micl-timepicker__period .micl-timepicker__pm:focus-visible{outline:var(--md-sys-state-focus-indicator-thickness) solid var(--md-sys-color-secondary);outline-offset:-2px}.micl-timepicker__period .micl-timepicker__am{border-start-start-radius:var(--md-sys-shape-corner-small);border-start-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm{border-block-start-width:0px;border-end-start-radius:var(--md-sys-shape-corner-small);border-end-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm::before{content:"PM"}.micl-timepicker__supporting-text-hour,.micl-timepicker__supporting-text-minute{font:var(--md-sys-typescale-body-small-weight) var(--md-sys-typescale-body-small-size)/var(--md-sys-typescale-body-small-line-height) var(--md-sys-typescale-body-small-font);letter-spacing:var(--md-sys-typescale-body-small-tracking);grid-area:hsup;padding-block:4px 0;color:var(--md-comp-time-picker-supporting-text-color, var(--md-sys-color-on-surface-variant))}.micl-timepicker__supporting-text-minute{grid-area:msup}.micl-timepicker .micl-timepicker__dial{--micl-dial-radius: calc((var(--_dial-size) - var(--_target)) / 2);--micl-hour-radius: var(--micl-dial-radius);--micl-angle: 0deg;position:relative;grid-area:dial;justify-self:center;block-size:var(--_dial-size);inline-size:var(--_dial-size);margin-block:36px 0;margin-inline:0;outline:none;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-comp-time-picker-clock-dial-color, var(--md-sys-color-surface-container-highest));list-style-type:none;touch-action:none}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner{--micl-hour-radius: calc(var(--micl-dial-radius) - var(--_target) + 12px);z-index:2}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner::before{z-index:2}.micl-timepicker .micl-timepicker__dial data{--micl-a: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * cos(var(--micl-angle))));--micl-b: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * sin(var(--micl-angle))));font:var(--md-sys-typescale-body-large-weight) var(--md-sys-typescale-body-large-size)/var(--md-sys-typescale-body-large-line-height) var(--md-sys-typescale-body-large-font);letter-spacing:var(--md-sys-typescale-body-large-tracking);position:absolute;display:grid;place-content:center;block-size:var(--_target);inline-size:var(--_target);inset-inline-start:var(--micl-a);inset-block-start:var(--micl-b);outline:none;border-radius:var(--md-sys-shape-corner-full);color:var(--md-comp-time-picker-clock-dial-unselected-label-text-color, var(--md-sys-color-on-surface));cursor:pointer;z-index:1;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__time--selected{color:var(--md-comp-time-picker-clock-dial-selected-label-text-color, var(--md-sys-color-on-primary));background-color:var(--md-comp-time-picker-clock-dial-selector-handle-container-color, var(--md-sys-color-primary))}.micl-timepicker .micl-timepicker__dial data::before{content:"";position:absolute;block-size:var(--_target);inline-size:calc(2*var(--_target));inset-inline-start:0;inset-block-end:0;transform:rotate(var(--micl-angle)) translate(calc(-1 * var(--_target)));transform-origin:calc(var(--_target)/2) center;z-index:1}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track{--micl-track-length: 92px;position:relative;display:block;inline-size:var(--_track-width);block-size:var(--micl-track-length);inset-inline-start:calc((var(--_dial-size) - var(--_track-width))/2);inset-block-start:calc(var(--_dial-size)/2 - var(--micl-track-length));border-radius:calc(var(--_track-width)*2);background-color:var(--md-comp-time-picker-clock-dial-selector-track-container-color, var(--md-sys-color-primary));transform:rotate(calc(90deg + var(--micl-angle)));transform-origin:bottom}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track::before{content:"";position:absolute;display:block;block-size:var(--_center-size);inline-size:var(--_center-size);inset-block-end:-3px;inset-inline-start:-3px;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-comp-time-picker-clock-dial-selector-center-container-color, var(--md-sys-color-primary))}.micl-timepicker__dial--hidden{display:none !important}
+:root{--md-ref-typeface-plain: Google Sans, system-ui, sans-serif;--md-ref-typeface-plain-narrow: 0;--md-ref-typeface-brand: Google Sans, system-ui, sans-serif;--md-ref-typeface-weight-regular: 400;--md-ref-typeface-weight-medium: 500;--md-ref-typeface-weight-bold: 700}:root{--md-sys-shape-corner-small: 8px}:root{--md-sys-shape-corner-full: 50%}:root{--md-sys-state-hover-state-layer-opacity: 8%}:root{--md-sys-state-focus-state-layer-opacity: 10%}:root{--md-sys-state-pressed-state-layer-opacity: 10%}:root{--md-sys-state-focus-indicator-thickness: 3px}@property --statelayer-color{syntax:"<color>";initial-value:rgba(0,0,0,0);inherits:false}@property --statelayer-opacity{syntax:"<percentage>";initial-value:0%;inherits:false}:root{--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-large-size: 3.5625rem;--md-sys-typescale-display-large-line-height: 4rem;--md-sys-typescale-display-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-large-tracking: -0.0125rem}:root{--md-sys-typescale-display-medium-font: var(--md-ref-typeface-brand);--md-sys-typescale-display-medium-size: 2.8125rem;--md-sys-typescale-display-medium-line-height: 3.25rem;--md-sys-typescale-display-medium-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-display-medium-tracking: 0}:root{--md-sys-typescale-title-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-title-medium-size: 1rem;--md-sys-typescale-title-medium-line-height: 1.5rem;--md-sys-typescale-title-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-title-medium-tracking: 0.0125rem}:root{--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-large-size: 1rem;--md-sys-typescale-body-large-line-height: 1.5rem;--md-sys-typescale-body-large-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-large-tracking: 0.03125rem}:root{--md-sys-typescale-body-small-font: var(--md-ref-typeface-plain);--md-sys-typescale-body-small-size: 0.75rem;--md-sys-typescale-body-small-line-height: 1rem;--md-sys-typescale-body-small-weight: var(--md-ref-typeface-weight-regular);--md-sys-typescale-body-small-tracking: 0.025rem}:root{--md-sys-typescale-label-medium-font: var(--md-ref-typeface-plain);--md-sys-typescale-label-medium-size: 0.75rem;--md-sys-typescale-label-medium-line-height: 1rem;--md-sys-typescale-label-medium-weight: var(--md-ref-typeface-weight-medium);--md-sys-typescale-label-medium-tracking: 0.03125rem}.micl-timepicker__period .micl-timepicker__am,.micl-timepicker__period .micl-timepicker__pm,.micl-timepicker input[name=hour],.micl-timepicker input[name=minute]{--statelayer-color: currentColor;background-image:linear-gradient(rgb(from var(--statelayer-color) r g b/var(--statelayer-opacity)));background-repeat:no-repeat;background-size:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:--statelayer-opacity var(--md-comp-time-picker-motion-duration) linear}.micl-timepicker__period .micl-timepicker__am:hover,.micl-timepicker__period .micl-timepicker__pm:hover,.micl-timepicker input[name=hour]:hover,.micl-timepicker input[name=minute]:hover{--statelayer-opacity: var(--md-sys-state-hover-state-layer-opacity)}.micl-timepicker__period .micl-timepicker__am:focus-visible,.micl-timepicker__period .micl-timepicker__pm:focus-visible,.micl-timepicker input[name=hour]:focus-visible,.micl-timepicker input[name=minute]:focus-visible{--statelayer-opacity: var(--md-sys-state-focus-state-layer-opacity)}.micl-timepicker__period .micl-timepicker__am:active,.micl-timepicker__period .micl-timepicker__pm:active,.micl-timepicker input[name=hour]:active,.micl-timepicker input[name=minute]:active{--statelayer-opacity: var(--md-sys-state-pressed-state-layer-opacity)}dialog.micl-dialog.micl-timepicker{--md-comp-time-picker-motion-duration: 350ms;--_input-height: var(--md-comp-time-picker-time-selector-container-height, 72px);--_input-width: var(--md-comp-time-picker-time-selector-container-width, 96px);--_separator-width: var(--md-comp-time-picker-separator-width, 24px);--_period-height: var(--md-comp-time-picker-period-selector-container-height, 72px);--_period-width: var(--md-comp-time-picker-period-selector-container-width, 52px);--_dial-size: var(--md-comp-time-picker-clock-dial-container-size, 256px);--_center-size: var(--md-comp-time-picker-clock-dial-selector-center-container-size, 8px);--_track-width: var(--md-comp-time-picker-clock-dial-selector-track-container-width, 2px);--_target: var(--md-sys-state-target-size, 48px)}dialog.micl-dialog.micl-timepicker .micl-dialog__headline{padding-block-end:20px}dialog.micl-dialog.micl-timepicker .micl-dialog__headline h2{font:var(--md-sys-typescale-label-medium-weight) var(--md-sys-typescale-label-medium-size)/var(--md-sys-typescale-label-medium-line-height) var(--md-sys-typescale-label-medium-font);letter-spacing:var(--md-sys-typescale-label-medium-tracking);color:var(--md-comp-time-picker-headline-color, var(--md-sys-color-on-surface-variant))}dialog.micl-dialog.micl-timepicker .micl-dialog__content{display:grid;padding-block-start:1px;grid-template-areas:"hr sep min per" "hsup hsup msup msup" "dial dial dial dial";grid-template-columns:auto var(--_separator-width) var(--_input-width) auto}dialog.micl-dialog.micl-timepicker .micl-dialog__actions:has(.micl-timepicker__inputmode){justify-content:space-between}dialog.micl-dialog.micl-timepicker .micl-dialog__actions .micl-timepicker__inputmode{margin-inline-start:-8px}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)){--_input-height: var(--md-comp-time-picker-time-selector-container-height, 80px);--_period-height: var(--md-comp-time-picker-period-selector-container-height, 80px)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal{--_period-height: var(--md-comp-time-picker-period-selector-container-height, 38px)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__headline{padding-block-end:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content{grid-template-areas:"x x x dial" "hr sep min dial" "per per per dial";grid-template-rows:72px var(--_input-height) auto}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period{--_ampm-height: var(--_period-height);--_period-width: calc(2 * var(--_input-width) + var(--_separator-width));display:flex;align-self:flex-start;margin-inline:0;margin-block:16px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__am{border-start-end-radius:0;border-end-start-radius:var(--md-sys-shape-corner-small)}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__period .micl-timepicker__pm{border-block-start-width:1px;border-inline-start-width:0px;border-start-end-radius:var(--md-sys-shape-corner-small);border-end-start-radius:0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)).micl-timepicker--horizontal .micl-dialog__content .micl-timepicker__dial{margin-block:0;margin-inline:40px 0}dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) .micl-timepicker__supporting-text-hour,dialog.micl-dialog.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) .micl-timepicker__supporting-text-minute{display:none}.micl-timepicker input[name=hour],.micl-timepicker input[name=minute]{font:var(--md-sys-typescale-display-medium-weight) var(--md-sys-typescale-display-medium-size)/var(--md-sys-typescale-display-medium-line-height) var(--md-sys-typescale-display-medium-font);letter-spacing:var(--md-sys-typescale-display-medium-tracking);box-sizing:border-box;inline-size:var(--_input-width);block-size:var(--_input-height);margin:0;padding:0;border:none;outline:none;border-radius:var(--md-sys-shape-corner-small);background-color:var(--md-comp-time-picker-time-selector-unselected-container-color, var(--md-sys-color-surface-container-highest));color:var(--md-comp-time-picker-time-selector-unselected-label-text-color, var(--md-sys-color-on-surface));text-align:center;user-select:none;-moz-appearance:textfield}.micl-timepicker input[name=hour]::-webkit-inner-spin-button,.micl-timepicker input[name=hour]::-webkit-outer-spin-button,.micl-timepicker input[name=minute]::-webkit-inner-spin-button,.micl-timepicker input[name=minute]::-webkit-outer-spin-button{-webkit-appearance:none}.micl-timepicker input[name=hour]::selection,.micl-timepicker input[name=minute]::selection{background-color:rgba(0,0,0,0)}.micl-timepicker input[name=hour].micl-timepicker--selected,.micl-timepicker input[name=minute].micl-timepicker--selected{background-color:var(--md-comp-time-picker-time-selector-selected-container-color, var(--md-sys-color-primary-container));color:var(--md-comp-time-picker-time-selector-selected-label-text-color, var(--md-sys-color-on-primary-container));border:2px solid var(--md-comp-time-input-focus-outline-color, var(--md-sys-color-primary))}.micl-timepicker input[name=hour]{grid-area:hr;justify-self:flex-end}.micl-timepicker input[name=minute]{grid-area:min}.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) input[name=hour],.micl-timepicker:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden)) input[name=minute]{font:var(--md-sys-typescale-display-large-weight) var(--md-sys-typescale-display-large-size)/var(--md-sys-typescale-display-large-line-height) var(--md-sys-typescale-display-large-font);letter-spacing:var(--md-sys-typescale-display-large-tracking);border:none;cursor:pointer}.micl-timepicker:not(:has(.micl-timepicker__am)):not(:has(.micl-timepicker__dial:not(.micl-timepicker__dial--hidden))){--_input-width: var(--md-comp-time-picker-time-selector-24h-container-width, 114px)}.micl-timepicker__separator{font:var(--md-sys-typescale-display-large-weight) var(--md-sys-typescale-display-large-size)/var(--md-sys-typescale-display-large-line-height) var(--md-sys-typescale-display-large-font);letter-spacing:var(--md-sys-typescale-display-large-tracking);grid-area:sep;block-size:var(--_input-height);line-height:var(--_input-height);inline-size:var(--_separator-width);text-align:center;color:var(--md-comp-time-picker-separator-color, var(--md-sys-color-on-surface))}.micl-timepicker__period{--_ampm-height: calc(var(--_period-height) / 2);grid-area:per;block-size:var(--_period-height);inline-size:0}.micl-timepicker__period:has(.micl-timepicker__am){inline-size:var(--_period-width);margin-inline:12px 0}.micl-timepicker__period .micl-timepicker__am,.micl-timepicker__period .micl-timepicker__pm{font:var(--md-sys-typescale-title-medium-weight) var(--md-sys-typescale-title-medium-size)/var(--md-sys-typescale-title-medium-line-height) var(--md-sys-typescale-title-medium-font);letter-spacing:var(--md-sys-typescale-title-medium-tracking);appearance:none;box-sizing:border-box;position:relative;display:flex;align-items:center;inline-size:var(--_period-width);block-size:var(--_ampm-height);min-block-size:var(--_ampm-height);margin:0;border:1px solid var(--md-comp-time-picker-period-selector-outline-color, var(--md-sys-color-outline));outline:none;color:var(--md-comp-time-picker-period-selector-unselected-label-text-color, var(--md-sys-color-on-surface-variant));background-color:rgba(0,0,0,0);cursor:pointer}.micl-timepicker__period .micl-timepicker__am::before,.micl-timepicker__period .micl-timepicker__pm::before{content:"AM";position:absolute;inline-size:100%;text-align:center}.micl-timepicker__period .micl-timepicker__am:checked,.micl-timepicker__period .micl-timepicker__pm:checked{color:var(--md-comp-time-picker-period-selector-selected-label-text-color, var(--md-sys-color-on-tertiary-container));background-color:var(--md-comp-time-picker-period-selector-selected-container-color, var(--md-sys-color-tertiary-container))}.micl-timepicker__period .micl-timepicker__am:focus-visible,.micl-timepicker__period .micl-timepicker__pm:focus-visible{outline:var(--md-sys-state-focus-indicator-thickness) solid var(--md-sys-color-secondary);outline-offset:-2px}.micl-timepicker__period .micl-timepicker__am{border-start-start-radius:var(--md-sys-shape-corner-small);border-start-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm{border-block-start-width:0px;border-end-start-radius:var(--md-sys-shape-corner-small);border-end-end-radius:var(--md-sys-shape-corner-small)}.micl-timepicker__period .micl-timepicker__pm::before{content:"PM"}.micl-timepicker__supporting-text-hour,.micl-timepicker__supporting-text-minute{font:var(--md-sys-typescale-body-small-weight) var(--md-sys-typescale-body-small-size)/var(--md-sys-typescale-body-small-line-height) var(--md-sys-typescale-body-small-font);letter-spacing:var(--md-sys-typescale-body-small-tracking);grid-area:hsup;padding-block:4px 0;color:var(--md-comp-time-picker-supporting-text-color, var(--md-sys-color-on-surface-variant))}.micl-timepicker__supporting-text-minute{grid-area:msup}.micl-timepicker .micl-timepicker__dial{--micl-dial-radius: calc((var(--_dial-size) - var(--_target)) / 2);--micl-hour-radius: var(--micl-dial-radius);--micl-angle: 0deg;position:relative;grid-area:dial;justify-self:center;block-size:var(--_dial-size);inline-size:var(--_dial-size);margin-block:36px 0;margin-inline:0;outline:none;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-comp-time-picker-clock-dial-color, var(--md-sys-color-surface-container-highest));list-style-type:none;touch-action:none}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner{--micl-hour-radius: calc(var(--micl-dial-radius) - var(--_target) + 12px);z-index:2}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__dial-inner::before{z-index:2}.micl-timepicker .micl-timepicker__dial data{--micl-a: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * cos(var(--micl-angle))));--micl-b: calc(var(--micl-dial-radius) + (var(--micl-hour-radius) * sin(var(--micl-angle))));font:var(--md-sys-typescale-body-large-weight) var(--md-sys-typescale-body-large-size)/var(--md-sys-typescale-body-large-line-height) var(--md-sys-typescale-body-large-font);letter-spacing:var(--md-sys-typescale-body-large-tracking);position:absolute;display:grid;place-content:center;block-size:var(--_target);inline-size:var(--_target);inset-inline-start:var(--micl-a);inset-block-start:var(--micl-b);outline:none;border-radius:var(--md-sys-shape-corner-full);color:var(--md-comp-time-picker-clock-dial-unselected-label-text-color, var(--md-sys-color-on-surface));cursor:pointer;z-index:1;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.micl-timepicker .micl-timepicker__dial data.micl-timepicker__time--selected{color:var(--md-comp-time-picker-clock-dial-selected-label-text-color, var(--md-sys-color-on-primary));background-color:var(--md-comp-time-picker-clock-dial-selector-handle-container-color, var(--md-sys-color-primary))}.micl-timepicker .micl-timepicker__dial data::before{content:"";position:absolute;block-size:var(--_target);inline-size:calc(2*var(--_target));inset-inline-start:0;inset-block-end:0;transform:rotate(var(--micl-angle)) translate(calc(-1 * var(--_target)));transform-origin:calc(var(--_target)/2) center;z-index:1}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track{--micl-track-length: 92px;position:relative;display:block;inline-size:var(--_track-width);block-size:var(--micl-track-length);inset-inline-start:calc((var(--_dial-size) - var(--_track-width))/2);inset-block-start:calc(var(--_dial-size)/2 - var(--micl-track-length));border-radius:calc(var(--_track-width)*2);background-color:var(--md-comp-time-picker-clock-dial-selector-track-container-color, var(--md-sys-color-primary));transform:rotate(calc(90deg + var(--micl-angle)));transform-origin:bottom}.micl-timepicker .micl-timepicker__dial .micl-timepicker__track::before{content:"";position:absolute;display:block;block-size:var(--_center-size);inline-size:var(--_center-size);inset-block-end:-3px;inset-inline-start:-3px;border-radius:var(--md-sys-shape-corner-full);background-color:var(--md-comp-time-picker-clock-dial-selector-center-container-color, var(--md-sys-color-primary))}.micl-timepicker__dial--hidden{display:none !important}

package/foundations/layout/index.scss

@@ -40,9 +40,12 @@ $md-sys-pane-spacer: 24px;
 $md-sys-pane-fixed-width-expanded: 360px;
 $md-sys-pane-fixed-width-large: 412px;
 
+$md-sys-card-margin: 8px;
+
 :root {
     --md-sys-layout-pane-spacer: #{$md-sys-pane-spacer};
     --md-sys-layout-window-margin: #{$md-sys-window-margin};
+    --md-sys-card-margin: #{$md-sys-card-margin};
 
     @media (max-width: $md-sys-breakpoint-compact-max) {
         --md-sys-layout-window-margin: #{$md-sys-window-margin-compact};
@@ -134,13 +137,13 @@ $md-sys-pane-fixed-width-large: 412px;
     }
     &:has(> .micl-card-elevated, > .micl-card-filled, > .micl-card-outlined),
     &> *:has(> .micl-card-elevated, > .micl-card-filled, > .micl-card-outlined) {
-        gap: var(--md-comp-card-margin, 8px);
+        gap: var(--md-sys-card-margin);
     }
     &> .micl-pane__columns {
         display: flex;
 
         &:has(> .micl-pane__column > .micl-card-elevated, > .micl-pane__column > .micl-card-filled, > .micl-pane__column > .micl-card-outlined) {
-            gap: var(--md-comp-card-margin, 8px);
+            gap: var(--md-sys-card-margin);
         }
         &> .micl-pane__column {
             display: flex;
@@ -150,7 +153,7 @@ $md-sys-pane-fixed-width-large: 412px;
             background-color: inherit;
 
             &:has(> .micl-card-elevated, > .micl-card-filled, > .micl-card-outlined) {
-                row-gap: var(--md-comp-card-margin, 8px);
+                row-gap: var(--md-sys-card-margin);
             }
             &.micl-pane__column--fixed {
                 flex: 0 0 auto;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "material-inspired-component-library",
-  "version": "9.1.0",
+  "version": "9.1.1",
   "description": "The Material-Inspired Component Library (MICL) offers a collection of beautifully crafted components leveraging native HTML markup, designed to align with the Material Design 3 guidelines.",
   "author": "MICL Hermana <micl.hermana@proton.me> (https://github.com/henkpb/micl)",
   "license": "MIT",
@@ -47,7 +47,7 @@
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/henkpb/micl"
+    "url": "git+https://github.com/henkpb/micl.git"
   },
   "homepage": "https://henkpb.github.io/micl",
   "bugs": {

package/{components/checkbox/_label.scss → styles/togglelabel.scss}

@@ -20,18 +20,26 @@
 // SOFTWARE.
 
 // The label rules shared by the toggle controls (checkbox, switch, radio): the label
-// immediately before or after the input is clickable, uses the on-surface color, and
-// dims alongside a disabled input. This partial emits nothing that is not extended.
+// wrapping, immediately before, or immediately after the input is clickable, uses the on-surface color, never
+// shows the tap highlight, and dims alongside a disabled input. The tap highlight is
+// suppressed for a disabled label too, so it belongs to %micl-toggle-label rather than
+// to %micl-toggle-label-pointer. This module emits nothing that is not extended.
 
 %micl-toggle-label-pointer {
-    -webkit-tap-highlight-color: transparent;
     cursor: pointer;
 }
 
 %micl-toggle-label {
     color: var(--md-sys-color-on-surface);
+    -webkit-tap-highlight-color: transparent;
 }
 
 %micl-toggle-label-disabled {
     opacity: var(--md-sys-state-disabled-state-layer-opacity, 38%);
 }
+
+// A label that wraps its input cannot be dimmed with opacity: that would dim the control
+// inside it on top of the disabled treatment it already paints. Fade only the text.
+%micl-toggle-label-disabled-text {
+    color: rgb(from var(--md-sys-color-on-surface) r g b / var(--md-sys-state-disabled-state-layer-opacity, 38%));
+}