@ikas/component-cli 0.102.0 → 0.103.0

package/templates/create-full/src/global.css

@@ -1,582 +0,0 @@
-/*
- * Global styles for your ikas code components project.
- * These styles are NOT scoped — they apply across all components.
- * Use this for CSS resets, base typography, utility classes, or CSS variables.
- *
- * Loading order:
- *   1. Global CSS (this file) — lowest specificity
- *   2. Shared chunk CSS — multi-scope (.cc_a .sel, .cc_b .sel)
- *   3. Component CSS — single scope (.cc_id .sel) — highest specificity
- *
- * Component-scoped styles naturally override these globals.
- */
-
-/* ===== Colors — Kombos Design System ===== */
-
-:root {
-  /* Z-Index */
-  --kombos-z-dropdown: 50;
-  --kombos-z-header: 100;
-  --kombos-z-overlay: 200;
-
-  /* Base */
-  --kombos-white: #ffffff;
-
-  /* Semantic */
-  --kombos-error: #d4323b;
-  --kombos-success: #0a8a4f;
-  --kombos-warning: #b87514;
-  --kombos-info: #2563eb;
-  --kombos-badge-bg: #ff0000;
-  --kombos-discount-bg: #c8102e;
-  --kombos-success-bg: #ceffb3;
-  --kombos-error-hover: #c82f37;
-
-  /* Gray */
-  --kombos-gray-50: #fafafa;
-  --kombos-gray-100: #f6f6f6;
-  --kombos-gray-200: #ececed;
-  --kombos-gray-300: #c4c4c6;
-  --kombos-gray-400: #9c9c9f;
-  --kombos-gray-500: #727276;
-  --kombos-gray-600: #4a4a4f;
-  --kombos-gray-700: #2e2e33;
-  --kombos-gray-800: #202025;
-  --kombos-gray-900: #14141a;
-
-  /* Layout */
-  --kombos-max-width: 93.75rem;
-
-}
-
-/* ===== Typography — Kombos Design System ===== */
-/* Font: Montserrat | Weights: Regular 400, Medium 500, Semibold 600 */
-
-/* --- Display --- */
-
-.display-xxl-regular   { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; }
-.display-xxl-medium    { font-weight: 500; font-size: 4.5rem; line-height: 5.625rem; }
-.display-xxl-semibold  { font-weight: 600; font-size: 4.5rem; line-height: 5.625rem; }
-
-.display-xl-regular    { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; }
-.display-xl-medium     { font-weight: 500; font-size: 3.75rem; line-height: 4.5rem; }
-.display-xl-semibold   { font-weight: 600; font-size: 3.75rem; line-height: 4.5rem; }
-
-.display-lg-regular    { font-weight: 400; font-size: 3rem; line-height: 3.75rem; }
-.display-lg-medium     { font-weight: 500; font-size: 3rem; line-height: 3.75rem; }
-.display-lg-semibold   { font-weight: 600; font-size: 3rem; line-height: 3.75rem; }
-
-.display-md-regular    { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; }
-.display-md-medium     { font-weight: 500; font-size: 2.25rem; line-height: 2.75rem; }
-.display-md-semibold   { font-weight: 600; font-size: 2.25rem; line-height: 2.75rem; }
-
-.display-sm-regular    { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; }
-.display-sm-medium     { font-weight: 500; font-size: 1.875rem; line-height: 2.375rem; }
-.display-sm-semibold   { font-weight: 600; font-size: 1.875rem; line-height: 2.375rem; }
-
-.display-xs-regular    { font-weight: 400; font-size: 1.5rem; line-height: 2rem; }
-.display-xs-medium     { font-weight: 500; font-size: 1.5rem; line-height: 2rem; }
-.display-xs-semibold   { font-weight: 600; font-size: 1.5rem; line-height: 2rem; }
-
-/* --- Text --- */
-
-.text-xl-regular       { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; }
-.text-xl-medium        { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; }
-.text-xl-semibold      { font-weight: 600; font-size: 1.25rem; line-height: 1.875rem; }
-
-.text-lg-regular       { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; }
-.text-lg-medium        { font-weight: 500; font-size: 1.125rem; line-height: 1.75rem; }
-.text-lg-semibold      { font-weight: 600; font-size: 1.125rem; line-height: 1.75rem; }
-
-.text-md-regular       { font-weight: 400; font-size: 1rem; line-height: 1.5rem; }
-.text-md-medium        { font-weight: 500; font-size: 1rem; line-height: 1.5rem; }
-.text-md-semibold      { font-weight: 600; font-size: 1rem; line-height: 1.5rem; }
-
-.text-sm-regular       { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; }
-.text-sm-medium        { font-weight: 500; font-size: 0.875rem; line-height: 1.25rem; }
-.text-sm-semibold      { font-weight: 600; font-size: 0.875rem; line-height: 1.25rem; }
-
-.text-xs-regular       { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; }
-.text-xs-medium        { font-weight: 500; font-size: 0.75rem; line-height: 1.125rem; }
-.text-xs-semibold      { font-weight: 600; font-size: 0.75rem; line-height: 1.125rem; }
-
-/* --- Strikethrough variants --- */
-
-.text-xl-medium-strike  { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; text-decoration: line-through; }
-.text-md-regular-strike { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: line-through; }
-.text-sm-regular-strike { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: line-through; }
-.text-xs-regular-strike { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; text-decoration: line-through; }
-
-/* --- Underline variants --- */
-
-.display-xxl-underline { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; text-decoration: underline; }
-.display-xl-underline  { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; text-decoration: underline; }
-.display-lg-underline  { font-weight: 400; font-size: 3rem; line-height: 3.75rem; text-decoration: underline; }
-.display-md-underline  { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; text-decoration: underline; }
-.display-sm-underline  { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; text-decoration: underline; }
-.display-xs-underline  { font-weight: 400; font-size: 1.5rem; line-height: 2rem; text-decoration: underline; }
-.text-xl-underline     { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; text-decoration: underline; }
-.text-lg-underline     { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; text-decoration: underline; }
-.text-md-underline     { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: underline; }
-.text-sm-underline     { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: underline; }
-.text-xs-underline     { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; text-decoration: underline; }
-
-/* --- Responsive: sm (640px+) — Tailwind-style prefix --- */
-
-@media (min-width: 640px) {
-  /* Display */
-  .sm\:display-xxl-regular   { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; }
-  .sm\:display-xxl-medium    { font-weight: 500; font-size: 4.5rem; line-height: 5.625rem; }
-  .sm\:display-xxl-semibold  { font-weight: 600; font-size: 4.5rem; line-height: 5.625rem; }
-
-  .sm\:display-xl-regular    { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; }
-  .sm\:display-xl-medium     { font-weight: 500; font-size: 3.75rem; line-height: 4.5rem; }
-  .sm\:display-xl-semibold   { font-weight: 600; font-size: 3.75rem; line-height: 4.5rem; }
-
-  .sm\:display-lg-regular    { font-weight: 400; font-size: 3rem; line-height: 3.75rem; }
-  .sm\:display-lg-medium     { font-weight: 500; font-size: 3rem; line-height: 3.75rem; }
-  .sm\:display-lg-semibold   { font-weight: 600; font-size: 3rem; line-height: 3.75rem; }
-
-  .sm\:display-md-regular    { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; }
-  .sm\:display-md-medium     { font-weight: 500; font-size: 2.25rem; line-height: 2.75rem; }
-  .sm\:display-md-semibold   { font-weight: 600; font-size: 2.25rem; line-height: 2.75rem; }
-
-  .sm\:display-sm-regular    { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; }
-  .sm\:display-sm-medium     { font-weight: 500; font-size: 1.875rem; line-height: 2.375rem; }
-  .sm\:display-sm-semibold   { font-weight: 600; font-size: 1.875rem; line-height: 2.375rem; }
-
-  .sm\:display-xs-regular    { font-weight: 400; font-size: 1.5rem; line-height: 2rem; }
-  .sm\:display-xs-medium     { font-weight: 500; font-size: 1.5rem; line-height: 2rem; }
-  .sm\:display-xs-semibold   { font-weight: 600; font-size: 1.5rem; line-height: 2rem; }
-
-  /* Text */
-  .sm\:text-xl-regular       { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; }
-  .sm\:text-xl-medium        { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; }
-  .sm\:text-xl-semibold      { font-weight: 600; font-size: 1.25rem; line-height: 1.875rem; }
-
-  .sm\:text-lg-regular       { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; }
-  .sm\:text-lg-medium        { font-weight: 500; font-size: 1.125rem; line-height: 1.75rem; }
-  .sm\:text-lg-semibold      { font-weight: 600; font-size: 1.125rem; line-height: 1.75rem; }
-
-  .sm\:text-md-regular       { font-weight: 400; font-size: 1rem; line-height: 1.5rem; }
-  .sm\:text-md-medium        { font-weight: 500; font-size: 1rem; line-height: 1.5rem; }
-  .sm\:text-md-semibold      { font-weight: 600; font-size: 1rem; line-height: 1.5rem; }
-
-  .sm\:text-sm-regular       { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; }
-  .sm\:text-sm-medium        { font-weight: 500; font-size: 0.875rem; line-height: 1.25rem; }
-  .sm\:text-sm-semibold      { font-weight: 600; font-size: 0.875rem; line-height: 1.25rem; }
-
-  .sm\:text-xs-regular       { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; }
-  .sm\:text-xs-medium        { font-weight: 500; font-size: 0.75rem; line-height: 1.125rem; }
-  .sm\:text-xs-semibold      { font-weight: 600; font-size: 0.75rem; line-height: 1.125rem; }
-
-  /* Strikethrough */
-  .sm\:text-xl-medium-strike  { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; text-decoration: line-through; }
-  .sm\:text-md-regular-strike { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: line-through; }
-  .sm\:text-sm-regular-strike { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: line-through; }
-  .sm\:text-xs-regular-strike { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; text-decoration: line-through; }
-
-  /* Underline — Display */
-  .sm\:display-xxl-underline { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; text-decoration: underline; }
-  .sm\:display-xl-underline  { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; text-decoration: underline; }
-  .sm\:display-lg-underline  { font-weight: 400; font-size: 3rem; line-height: 3.75rem; text-decoration: underline; }
-  .sm\:display-md-underline  { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; text-decoration: underline; }
-  .sm\:display-sm-underline  { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; text-decoration: underline; }
-  .sm\:display-xs-underline  { font-weight: 400; font-size: 1.5rem; line-height: 2rem; text-decoration: underline; }
-
-  /* Underline — Text */
-  .sm\:text-xl-underline     { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; text-decoration: underline; }
-  .sm\:text-lg-underline     { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; text-decoration: underline; }
-  .sm\:text-md-underline     { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: underline; }
-  .sm\:text-sm-underline     { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: underline; }
-  .sm\:text-xs-underline     { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; text-decoration: underline; }
-}
-
-/* --- Responsive: md (768px+) — Tailwind-style prefix --- */
-
-@media (min-width: 768px) {
-  /* Display */
-  .md\:display-xxl-regular   { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; }
-  .md\:display-xxl-medium    { font-weight: 500; font-size: 4.5rem; line-height: 5.625rem; }
-  .md\:display-xxl-semibold  { font-weight: 600; font-size: 4.5rem; line-height: 5.625rem; }
-
-  .md\:display-xl-regular    { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; }
-  .md\:display-xl-medium     { font-weight: 500; font-size: 3.75rem; line-height: 4.5rem; }
-  .md\:display-xl-semibold   { font-weight: 600; font-size: 3.75rem; line-height: 4.5rem; }
-
-  .md\:display-lg-regular    { font-weight: 400; font-size: 3rem; line-height: 3.75rem; }
-  .md\:display-lg-medium     { font-weight: 500; font-size: 3rem; line-height: 3.75rem; }
-  .md\:display-lg-semibold   { font-weight: 600; font-size: 3rem; line-height: 3.75rem; }
-
-  .md\:display-md-regular    { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; }
-  .md\:display-md-medium     { font-weight: 500; font-size: 2.25rem; line-height: 2.75rem; }
-  .md\:display-md-semibold   { font-weight: 600; font-size: 2.25rem; line-height: 2.75rem; }
-
-  .md\:display-sm-regular    { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; }
-  .md\:display-sm-medium     { font-weight: 500; font-size: 1.875rem; line-height: 2.375rem; }
-  .md\:display-sm-semibold   { font-weight: 600; font-size: 1.875rem; line-height: 2.375rem; }
-
-  .md\:display-xs-regular    { font-weight: 400; font-size: 1.5rem; line-height: 2rem; }
-  .md\:display-xs-medium     { font-weight: 500; font-size: 1.5rem; line-height: 2rem; }
-  .md\:display-xs-semibold   { font-weight: 600; font-size: 1.5rem; line-height: 2rem; }
-
-  /* Text */
-  .md\:text-xl-regular       { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; }
-  .md\:text-xl-medium        { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; }
-  .md\:text-xl-semibold      { font-weight: 600; font-size: 1.25rem; line-height: 1.875rem; }
-
-  .md\:text-lg-regular       { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; }
-  .md\:text-lg-medium        { font-weight: 500; font-size: 1.125rem; line-height: 1.75rem; }
-  .md\:text-lg-semibold      { font-weight: 600; font-size: 1.125rem; line-height: 1.75rem; }
-
-  .md\:text-md-regular       { font-weight: 400; font-size: 1rem; line-height: 1.5rem; }
-  .md\:text-md-medium        { font-weight: 500; font-size: 1rem; line-height: 1.5rem; }
-  .md\:text-md-semibold      { font-weight: 600; font-size: 1rem; line-height: 1.5rem; }
-
-  .md\:text-sm-regular       { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; }
-  .md\:text-sm-medium        { font-weight: 500; font-size: 0.875rem; line-height: 1.25rem; }
-  .md\:text-sm-semibold      { font-weight: 600; font-size: 0.875rem; line-height: 1.25rem; }
-
-  .md\:text-xs-regular       { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; }
-  .md\:text-xs-medium        { font-weight: 500; font-size: 0.75rem; line-height: 1.125rem; }
-  .md\:text-xs-semibold      { font-weight: 600; font-size: 0.75rem; line-height: 1.125rem; }
-
-  /* Strikethrough */
-  .md\:text-xl-medium-strike  { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; text-decoration: line-through; }
-  .md\:text-md-regular-strike { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: line-through; }
-  .md\:text-sm-regular-strike { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: line-through; }
-  .md\:text-xs-regular-strike { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; text-decoration: line-through; }
-
-  /* Underline — Display */
-  .md\:display-xxl-underline { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; text-decoration: underline; }
-  .md\:display-xl-underline  { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; text-decoration: underline; }
-  .md\:display-lg-underline  { font-weight: 400; font-size: 3rem; line-height: 3.75rem; text-decoration: underline; }
-  .md\:display-md-underline  { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; text-decoration: underline; }
-  .md\:display-sm-underline  { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; text-decoration: underline; }
-  .md\:display-xs-underline  { font-weight: 400; font-size: 1.5rem; line-height: 2rem; text-decoration: underline; }
-
-  /* Underline — Text */
-  .md\:text-xl-underline     { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; text-decoration: underline; }
-  .md\:text-lg-underline     { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; text-decoration: underline; }
-  .md\:text-md-underline     { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: underline; }
-  .md\:text-sm-underline     { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: underline; }
-  .md\:text-xs-underline     { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; text-decoration: underline; }
-}
-
-/* --- Responsive: lg (1024px+) — Tailwind-style prefix --- */
-
-@media (min-width: 1024px) {
-  /* Display */
-  .lg\:display-xxl-regular   { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; }
-  .lg\:display-xxl-medium    { font-weight: 500; font-size: 4.5rem; line-height: 5.625rem; }
-  .lg\:display-xxl-semibold  { font-weight: 600; font-size: 4.5rem; line-height: 5.625rem; }
-
-  .lg\:display-xl-regular    { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; }
-  .lg\:display-xl-medium     { font-weight: 500; font-size: 3.75rem; line-height: 4.5rem; }
-  .lg\:display-xl-semibold   { font-weight: 600; font-size: 3.75rem; line-height: 4.5rem; }
-
-  .lg\:display-lg-regular    { font-weight: 400; font-size: 3rem; line-height: 3.75rem; }
-  .lg\:display-lg-medium     { font-weight: 500; font-size: 3rem; line-height: 3.75rem; }
-  .lg\:display-lg-semibold   { font-weight: 600; font-size: 3rem; line-height: 3.75rem; }
-
-  .lg\:display-md-regular    { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; }
-  .lg\:display-md-medium     { font-weight: 500; font-size: 2.25rem; line-height: 2.75rem; }
-  .lg\:display-md-semibold   { font-weight: 600; font-size: 2.25rem; line-height: 2.75rem; }
-
-  .lg\:display-sm-regular    { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; }
-  .lg\:display-sm-medium     { font-weight: 500; font-size: 1.875rem; line-height: 2.375rem; }
-  .lg\:display-sm-semibold   { font-weight: 600; font-size: 1.875rem; line-height: 2.375rem; }
-
-  .lg\:display-xs-regular    { font-weight: 400; font-size: 1.5rem; line-height: 2rem; }
-  .lg\:display-xs-medium     { font-weight: 500; font-size: 1.5rem; line-height: 2rem; }
-  .lg\:display-xs-semibold   { font-weight: 600; font-size: 1.5rem; line-height: 2rem; }
-
-  /* Text */
-  .lg\:text-xl-regular       { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; }
-  .lg\:text-xl-medium        { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; }
-  .lg\:text-xl-semibold      { font-weight: 600; font-size: 1.25rem; line-height: 1.875rem; }
-
-  .lg\:text-lg-regular       { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; }
-  .lg\:text-lg-medium        { font-weight: 500; font-size: 1.125rem; line-height: 1.75rem; }
-  .lg\:text-lg-semibold      { font-weight: 600; font-size: 1.125rem; line-height: 1.75rem; }
-
-  .lg\:text-md-regular       { font-weight: 400; font-size: 1rem; line-height: 1.5rem; }
-  .lg\:text-md-medium        { font-weight: 500; font-size: 1rem; line-height: 1.5rem; }
-  .lg\:text-md-semibold      { font-weight: 600; font-size: 1rem; line-height: 1.5rem; }
-
-  .lg\:text-sm-regular       { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; }
-  .lg\:text-sm-medium        { font-weight: 500; font-size: 0.875rem; line-height: 1.25rem; }
-  .lg\:text-sm-semibold      { font-weight: 600; font-size: 0.875rem; line-height: 1.25rem; }
-
-  .lg\:text-xs-regular       { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; }
-  .lg\:text-xs-medium        { font-weight: 500; font-size: 0.75rem; line-height: 1.125rem; }
-  .lg\:text-xs-semibold      { font-weight: 600; font-size: 0.75rem; line-height: 1.125rem; }
-
-  /* Strikethrough */
-  .lg\:text-xl-medium-strike  { font-weight: 500; font-size: 1.25rem; line-height: 1.875rem; text-decoration: line-through; }
-  .lg\:text-md-regular-strike { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: line-through; }
-  .lg\:text-sm-regular-strike { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: line-through; }
-
-  /* Underline — Display */
-  .lg\:display-xxl-underline { font-weight: 400; font-size: 4.5rem; line-height: 5.625rem; text-decoration: underline; }
-  .lg\:display-xl-underline  { font-weight: 400; font-size: 3.75rem; line-height: 4.5rem; text-decoration: underline; }
-  .lg\:display-lg-underline  { font-weight: 400; font-size: 3rem; line-height: 3.75rem; text-decoration: underline; }
-  .lg\:display-md-underline  { font-weight: 400; font-size: 2.25rem; line-height: 2.75rem; text-decoration: underline; }
-  .lg\:display-sm-underline  { font-weight: 400; font-size: 1.875rem; line-height: 2.375rem; text-decoration: underline; }
-  .lg\:display-xs-underline  { font-weight: 400; font-size: 1.5rem; line-height: 2rem; text-decoration: underline; }
-
-  /* Underline — Text */
-  .lg\:text-xl-underline     { font-weight: 400; font-size: 1.25rem; line-height: 1.875rem; text-decoration: underline; }
-  .lg\:text-lg-underline     { font-weight: 400; font-size: 1.125rem; line-height: 1.75rem; text-decoration: underline; }
-  .lg\:text-md-underline     { font-weight: 400; font-size: 1rem; line-height: 1.5rem; text-decoration: underline; }
-  .lg\:text-sm-underline     { font-weight: 400; font-size: 0.875rem; line-height: 1.25rem; text-decoration: underline; }
-  .lg\:text-xs-underline     { font-weight: 400; font-size: 0.75rem; line-height: 1.125rem; text-decoration: underline; }
-}
-
-/* --- Icons --- */
-
-svg.kombos-icon {
-  fill: none;
-  font-size: inherit;
-  height: 1em;
-}
-
-svg.kombos-icon path {
-  color: currentColor;
-}
-
-/* ===== Container — Max-Width Wrapper ===== */
-
-.kombos-container {
-  max-width: var(--kombos-max-width);
-  margin-left: auto;
-  margin-right: auto;
-  width: 100%;
-  padding-left: 1rem;
-  padding-right: 1rem;
-}
-
-@media (min-width: 768px) {
-  .kombos-container {
-    padding-left: 1.5rem;
-    padding-right: 1.5rem;
-  }
-}
-
-@media (min-width: 1024px) {
-  .kombos-container {
-    padding-left: 1.5rem;
-    padding-right: 1.5rem;
-  }
-}
-
-
-/* ===== Base Reset ===== */
-
-* {
-  word-break: break-word;
-}
-
-/* ===== Richtext ===== */
-
-img,
-video {
-  max-width: 100%;
-  height: auto;
-}
-
-.kombos-richtext {
-  color: var(--kombos-gray-900);
-  font-size: 14px;
-  overflow: hidden;
-  position: relative;
-  width: 100%;
-}
-
-.kombos-richtext th {
-  font-weight: bolder;
-  text-align: left;
-}
-
-.kombos-richtext caption {
-  text-align: left;
-}
-
-.kombos-richtext h1 {
-  font-size: 2em;
-  margin: 0;
-}
-
-.kombos-richtext h2 {
-  font-size: 1.5em;
-  margin: 0;
-}
-
-.kombos-richtext h3 {
-  font-size: 1.17em;
-  margin: 0;
-}
-
-.kombos-richtext h4,
-.kombos-richtext p,
-.kombos-richtext blockquote,
-.kombos-richtext ul,
-.kombos-richtext fieldset,
-.kombos-richtext form,
-.kombos-richtext ol,
-.kombos-richtext dl,
-.kombos-richtext dir,
-.kombos-richtext menu {
-  margin: 0;
-}
-
-.kombos-richtext h5 {
-  font-size: 0.83em;
-  margin: 0;
-}
-
-.kombos-richtext h6 {
-  font-size: 0.75em;
-  margin: 0;
-}
-
-.kombos-richtext h1,
-.kombos-richtext h2,
-.kombos-richtext h3,
-.kombos-richtext h4,
-.kombos-richtext h5,
-.kombos-richtext h6,
-.kombos-richtext b,
-.kombos-richtext strong {
-  font-weight: bolder;
-}
-
-.kombos-richtext blockquote {
-  margin-top: 0.625rem !important;
-  margin-bottom: 0.625rem !important;
-}
-
-.kombos-richtext i,
-.kombos-richtext cite,
-.kombos-richtext em,
-.kombos-richtext var,
-.kombos-richtext address {
-  font-style: italic;
-}
-
-.kombos-richtext pre,
-.kombos-richtext tt,
-.kombos-richtext code,
-.kombos-richtext kbd,
-.kombos-richtext samp {
-  font-family: monospace;
-}
-
-.kombos-richtext pre {
-  white-space: pre;
-}
-
-.kombos-richtext big {
-  font-size: 1.17em;
-}
-
-.kombos-richtext small,
-.kombos-richtext sub,
-.kombos-richtext sup {
-  font-size: 0.83em;
-}
-
-.kombos-richtext sub {
-  vertical-align: sub;
-}
-
-.kombos-richtext sup {
-  vertical-align: super;
-}
-
-.kombos-richtext table {
-  border-spacing: 2px;
-  border-collapse: collapse;
-}
-
-.kombos-richtext thead,
-.kombos-richtext tbody,
-.kombos-richtext tfoot {
-  vertical-align: middle;
-}
-
-.kombos-richtext td,
-.kombos-richtext th,
-.kombos-richtext tr {
-  vertical-align: inherit;
-}
-
-.kombos-richtext s,
-.kombos-richtext strike,
-.kombos-richtext del {
-  text-decoration: line-through;
-}
-
-.kombos-richtext hr {
-  border: 1px inset;
-}
-
-.kombos-richtext ol,
-.kombos-richtext ul,
-.kombos-richtext dir,
-.kombos-richtext menu,
-.kombos-richtext dd {
-  margin-left: 2.5rem;
-}
-
-.kombos-richtext ol {
-  list-style-type: decimal;
-}
-
-.kombos-richtext ul {
-  list-style-type: disc;
-}
-
-.kombos-richtext ol ul,
-.kombos-richtext ul ol,
-.kombos-richtext ul ul,
-.kombos-richtext ol ol {
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-.kombos-richtext {
-  line-height: 1.2;
-}
-
-/* HTML5 */
-
-.kombos-richtext figure {
-  margin: 1em 40px;
-}
-
-.centered-images img {
-  margin: 0 auto;
-}
-
-/* ===== Reduced Motion ===== */
-
-@media (prefers-reduced-motion: reduce) {
-  *, *::before, *::after {
-    animation-duration: 0.01ms !important;
-    animation-iteration-count: 1 !important;
-    transition-duration: 0.01ms !important;
-    scroll-behavior: auto !important;
-  }
-}
-
-/* ===== Shimmer Animation ===== */
-
-@keyframes kombos-shimmer {
-  0% {
-    background-position: -200% 0;
-  }
-  100% {
-    background-position: 200% 0;
-  }
-}

package/templates/create-full/src/hooks/useBundleProducts.ts

@@ -1,75 +0,0 @@
-import { useState, useEffect, useMemo } from "preact/hooks";
-import {
-  getSelectedProductVariant,
-  getBundleProductsOfVariant,
-  initBundleProducts,
-  hasBundleSettings,
-  IkasBundleProduct,
-  IkasProduct,
-  cartStore,
-  waitForCartStoreInit,
-} from "@ikas/bp-storefront";
-import { runInAction } from "mobx";
-import { adjustBundleProductQuantity } from "../utils/bundle";
-
-function adjustBundleQuantities(products: IkasBundleProduct[]) {
-  runInAction(() => {
-    for (const bp of products) {
-      adjustBundleProductQuantity(bp);
-    }
-  });
-}
-
-export function useBundleProducts(product: IkasProduct | null | undefined) {
-  const [isLoading, setIsLoading] = useState(true);
-
-  const editLineID =
-    typeof window !== "undefined"
-      ? new URLSearchParams(window.location.search).get("editLineID")
-      : null;
-
-  const selectedVariant = product ? getSelectedProductVariant(product) : null;
-
-  const hasBundle = selectedVariant
-    ? hasBundleSettings(selectedVariant)
-    : false;
-
-  const bundleSettings = hasBundle ? selectedVariant!.bundleSettings : null;
-
-  useEffect(() => {
-    if (!product || !selectedVariant || !bundleSettings) return;
-
-    let cancelled = false;
-
-    async function load() {
-      setIsLoading(true);
-
-      try {
-        if (editLineID) await waitForCartStoreInit(cartStore);
-
-        await getBundleProductsOfVariant(product!, selectedVariant!);
-        await initBundleProducts(product!);
-
-        if (!cancelled && bundleSettings) {
-          adjustBundleQuantities(bundleSettings.products);
-        }
-      } finally {
-        if (!cancelled) setIsLoading(false);
-      }
-    }
-
-    load();
-
-    return () => {
-      cancelled = true;
-    };
-  }, [selectedVariant, editLineID]);
-
-  const sortedProducts = useMemo(() => {
-    if (!bundleSettings) return [];
-
-    return [...bundleSettings.products].sort((a, b) => a.order - b.order);
-  }, [bundleSettings?.products]);
-
-  return { isLoading, selectedVariant, bundleSettings, sortedProducts };
-}

package/templates/create-full/src/hooks/useColumnPreference.ts

@@ -1,26 +0,0 @@
-import { useCallback, useEffect, useState } from "preact/hooks";
-
-const COLUMNS_STORAGE_KEY = "kombos-product-list-columns";
-
-export function useColumnPreference() {
-  const [columns, setColumns] = useState<3 | 4>(4);
-
-  useEffect(() => {
-    try {
-      const stored = localStorage.getItem(COLUMNS_STORAGE_KEY);
-      if (stored === "3") setColumns(3);
-    } catch {}
-  }, []);
-
-  const toggleColumns = useCallback(() => {
-    setColumns((prev) => {
-      const next = prev === 4 ? 3 : 4;
-      try {
-        localStorage.setItem(COLUMNS_STORAGE_KEY, String(next));
-      } catch {}
-      return next;
-    });
-  }, []);
-
-  return { columns, toggleColumns };
-}