chore(form): Optimize selectors

css/pico.classless.css

@@ -1331,11 +1331,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   opacity: 0;
 }
 
-[dir=rtl] [type=date],
+[dir=rtl] :is([type=date], [type=datetime-local], [type=month], [type=time], [type=week]) {
-[dir=rtl] [type=datetime-local],
-[dir=rtl] [type=month],
-[dir=rtl] [type=time],
-[dir=rtl] [type=week] {
   text-align: right;
 }
 
@@ -1346,10 +1342,6 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   border-radius: 0;
   background: none;
 }
-[type=file]:hover, [type=file]:active, [type=file]:focus {
-  border: none;
-  background: none;
-}
 [type=file]::-webkit-file-upload-button {
   --background-color: var(--secondary);
   --border-color: var(--secondary);
@@ -1399,11 +1391,11 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   cursor: pointer;
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-webkit-file-upload-button:hover, [type=file]::-webkit-file-upload-button:active, [type=file]::-webkit-file-upload-button:focus {
+[type=file]::-webkit-file-upload-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
-[type=file]::file-selector-button:hover, [type=file]::file-selector-button:active, [type=file]::file-selector-button:focus {
+[type=file]::file-selector-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
@@ -1432,7 +1424,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   -webkit-transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-webkit-file-upload-button:hover, [type=file]::-webkit-file-upload-button:active, [type=file]::-webkit-file-upload-button:focus {
+[type=file]::-webkit-file-upload-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
@@ -1459,7 +1451,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   -ms-transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-ms-browse:hover, [type=file]::-ms-browse:active, [type=file]::-ms-browse:focus {
+[type=file]::-ms-browse:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }

css/pico.css

@@ -1475,11 +1475,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   opacity: 0;
 }
 
-[dir=rtl] [type=date],
+[dir=rtl] :is([type=date], [type=datetime-local], [type=month], [type=time], [type=week]) {
-[dir=rtl] [type=datetime-local],
-[dir=rtl] [type=month],
-[dir=rtl] [type=time],
-[dir=rtl] [type=week] {
   text-align: right;
 }
 
@@ -1490,10 +1486,6 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   border-radius: 0;
   background: none;
 }
-[type=file]:hover, [type=file]:active, [type=file]:focus {
-  border: none;
-  background: none;
-}
 [type=file]::-webkit-file-upload-button {
   --background-color: var(--secondary);
   --border-color: var(--secondary);
@@ -1543,11 +1535,11 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   cursor: pointer;
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-webkit-file-upload-button:hover, [type=file]::-webkit-file-upload-button:active, [type=file]::-webkit-file-upload-button:focus {
+[type=file]::-webkit-file-upload-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
-[type=file]::file-selector-button:hover, [type=file]::file-selector-button:active, [type=file]::file-selector-button:focus {
+[type=file]::file-selector-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
@@ -1576,7 +1568,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   -webkit-transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-webkit-file-upload-button:hover, [type=file]::-webkit-file-upload-button:active, [type=file]::-webkit-file-upload-button:focus {
+[type=file]::-webkit-file-upload-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
@@ -1603,7 +1595,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   -ms-transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-ms-browse:hover, [type=file]::-ms-browse:active, [type=file]::-ms-browse:focus {
+[type=file]::-ms-browse:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }

css/pico.fluid.classless.css

@@ -1301,11 +1301,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   opacity: 0;
 }
 
-[dir=rtl] [type=date],
+[dir=rtl] :is([type=date], [type=datetime-local], [type=month], [type=time], [type=week]) {
-[dir=rtl] [type=datetime-local],
-[dir=rtl] [type=month],
-[dir=rtl] [type=time],
-[dir=rtl] [type=week] {
   text-align: right;
 }
 
@@ -1316,10 +1312,6 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   border-radius: 0;
   background: none;
 }
-[type=file]:hover, [type=file]:active, [type=file]:focus {
-  border: none;
-  background: none;
-}
 [type=file]::-webkit-file-upload-button {
   --background-color: var(--secondary);
   --border-color: var(--secondary);
@@ -1369,11 +1361,11 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   cursor: pointer;
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-webkit-file-upload-button:hover, [type=file]::-webkit-file-upload-button:active, [type=file]::-webkit-file-upload-button:focus {
+[type=file]::-webkit-file-upload-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
-[type=file]::file-selector-button:hover, [type=file]::file-selector-button:active, [type=file]::file-selector-button:focus {
+[type=file]::file-selector-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
@@ -1402,7 +1394,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   -webkit-transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-webkit-file-upload-button:hover, [type=file]::-webkit-file-upload-button:active, [type=file]::-webkit-file-upload-button:focus {
+[type=file]::-webkit-file-upload-button:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }
@@ -1429,7 +1421,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])[
   -ms-transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
   transition: background-color var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
 }
-[type=file]::-ms-browse:hover, [type=file]::-ms-browse:active, [type=file]::-ms-browse:focus {
+[type=file]::-ms-browse:is(:hover, :active, :focus) {
   --background-color: var(--secondary-hover);
   --border-color: var(--secondary-hover);
 }

scss/content/_form-alt-input-types.scss

@@ -35,7 +35,7 @@
 
 // Date & Time
 // :not() are needed to add Specificity and avoid !important on padding
-input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]) {
+input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]) {
   &[type="date"],
   &[type="datetime-local"],
   &[type="month"],
@@ -70,14 +70,9 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])
   }
 }
 
-[dir="rtl"] {
+[dir="rtl"]
-  [type="date"],
+  :is([type="date"], [type="datetime-local"], [type="month"], [type="time"], [type="week"]) {
-  [type="datetime-local"],
+  text-align: right;
-  [type="month"],
-  [type="time"],
-  [type="week"] {
-    text-align: right;
-  }
 }
 
 // File
@@ -88,13 +83,6 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])
   border-radius: 0;
   background: none;
 
-  &:hover,
-  &:active,
-  &:focus {
-    border: none;
-    background: none;
-  }
-
   @mixin file-selector-button {
     --background-color: var(--secondary);
     --border-color: var(--secondary);
@@ -123,9 +111,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])
         box-shadow var(--transition);
     }
 
-    &:hover,
+    &:is(:hover, :active, :focus) {
-    &:active,
-    &:focus {
       --background-color: var(--secondary-hover);
       --border-color: var(--secondary-hover);
     }
@@ -238,7 +224,7 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file])
 
 // Search
 // :not() are needed to add Specificity and avoid !important on padding
-input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]) {
+input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]) {
   &[type="search"] {
     padding-left: calc(var(--form-element-spacing-horizontal) + 1.75rem);
     border-radius: 5rem;