first commit

app/assets/styles/CloudProductPicker.CAm9rmUl.css

@@ -0,0 +1,122 @@
+.cloud-product-picker[data-v-a438862d] {
+  flex-direction: column;
+  gap: 24px;
+  min-width: 0;
+  display: flex;
+}
+.selection-section[data-v-a438862d] {
+  min-width: 0;
+}
+.selection-section h3[data-v-a438862d] {
+  border-bottom: 1px solid var(--p-content-border-color);
+  margin: 0 0 21px;
+  padding-bottom: 15px;
+  font-size: 1rem;
+  font-weight: 400;
+}
+.selection-section .products-title[data-v-a438862d] {
+  border: 0;
+  margin-bottom: 8px;
+  padding-bottom: 0;
+}
+.selection-label[data-v-a438862d] {
+  margin-bottom: 8px;
+}
+.zone-options[data-v-a438862d] {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 14px;
+  display: grid;
+}
+.product-options[data-v-a438862d] {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 14px;
+  display: grid;
+}
+.product-option[data-v-a438862d],
+.zone-option[data-v-a438862d] {
+  border: 1px solid var(--p-content-border-color);
+  background: var(--p-content-background);
+  min-width: 0;
+  min-height: 60px;
+  color: var(--p-text-color);
+  text-align: left;
+  cursor: pointer;
+  overflow-wrap: anywhere;
+  border-radius: 5px;
+  flex-direction: column;
+  gap: 10px;
+  padding: 17px 14px;
+  display: flex;
+  box-shadow: 0 1px 3px #0000001a;
+}
+.zone-option[data-v-a438862d] {
+  justify-content: center;
+  font-weight: 600;
+}
+.product-option[data-v-a438862d] {
+  gap: 0;
+  padding: 0;
+  overflow: hidden;
+}
+.product-option strong[data-v-a438862d] {
+  background: color-mix(
+    in srgb,
+    var(--p-primary-color) 8%,
+    var(--p-content-background)
+  );
+  padding: 14px;
+  font-weight: 600;
+  display: block;
+}
+.product-option span[data-v-a438862d] {
+  color: var(--p-text-muted-color);
+  padding: 14px;
+  font-size: 0.875rem;
+}
+.active[data-v-a438862d] {
+  outline: 2px solid var(--p-primary-color);
+  outline-offset: -1px;
+  background: color-mix(
+    in srgb,
+    var(--p-primary-color) 7%,
+    var(--p-content-background)
+  );
+  color: var(--p-primary-700);
+}
+.product-option[data-v-a438862d]:disabled,
+.zone-option[data-v-a438862d]:disabled {
+  opacity: 0.55;
+  cursor: not-allowed;
+}
+.product-option[data-v-a438862d]:focus-visible,
+.zone-option[data-v-a438862d]:focus-visible {
+  outline: 2px solid var(--p-primary-color);
+  outline-offset: 3px;
+}
+.catalog-empty[data-v-a438862d] {
+  text-align: center;
+  color: var(--p-text-muted-color);
+  border: 1px solid var(--p-content-border-color);
+  background: var(--p-content-background);
+  border-radius: 5px;
+  padding: 28px;
+}
+.catalog-empty i[data-v-a438862d] {
+  font-size: 1.75rem;
+}
+.catalog-empty a[data-v-a438862d] {
+  color: var(--p-primary-color);
+  text-decoration: none;
+}
+@media (width<=767px) {
+  .product-options[data-v-a438862d],
+  .zone-options[data-v-a438862d] {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 8px;
+  }
+}
+@media (width<=390px) {
+  .product-options[data-v-a438862d] {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}