/** * Match CustomKaro / Printbe theme: blue–purple accents, white surfaces. * Loads after bundled Qikink CSS. * * Core designer CSS is scoped with @scope (.qikink-designer-root) so it does not * change the theme header/menu fonts. This file adds palette variables + fixes. */ /* Palette — also on body so SweetAlert/modals outside .qikink-designer-root inherit */ body.qikink-designer-page { --qdk-primary: #2563eb; --qdk-primary-hover: #1d4ed8; --qdk-accent: #7c3aed; --qdk-gradient: linear-gradient(90deg, #2563eb 0%, #7c3aed 100%); --qdk-surface: #ffffff; --qdk-surface-soft: #f8fafc; --qdk-text: #0f172a; } /* ------------------------------------------------------------------------- Stop plugin styles from repainting the whole WordPress (styles.css sets body { background #faf7f3 !important }) ------------------------------------------------------------------------- */ body.qikink-designer-page { background-color: transparent !important; background: none !important; color: inherit; } body.qikink-designer-page .qikink-designer-root { font-family: inherit; color: var(--qdk-text); border-radius: 0; } body.qikink-designer-page .qikink-designer-root .main-content, body.qikink-designer-page .qikink-designer-root .page-content { background: transparent; } /* FPD + swiper row: flex children need min-width 0 or the canvas column collapses */ body.qikink-designer-page .qikink-designer-root .mockup-designer-layout { min-height: min(100vh, 900px); } body.qikink-designer-page .qikink-designer-root .mockup-designer-layout .min-w-0 { min-width: 0; } body.qikink-designer-page .qikink-designer-root #mockup_design #clothing-designer:not(.d-none) { min-height: 420px; } /* Nunito was forced in prototype; prefer theme typography */ body.qikink-designer-page .qikink-designer-root, body.qikink-designer-page .qikink-designer-root input, body.qikink-designer-page .qikink-designer-root button, body.qikink-designer-page .qikink-designer-root select { font-family: inherit; } /* Primary / CTA buttons (was #ff6700) */ body.qikink-designer-page .qikink-designer-root .qikink_btn, body.qikink-designer-page .qikink-designer-root .go-button.qikink_btn, body.qikink-designer-page .qikink-designer-root .btn.qikink_btn { background: var(--qdk-gradient) !important; background-color: var(--qdk-primary) !important; border: none !important; color: #fff !important; border-radius: 999px !important; box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25); } body.qikink-designer-page .qikink-designer-root .qikink_btn:hover, body.qikink-designer-page .qikink-designer-root .go-button.qikink_btn:hover { filter: brightness(1.05); background: var(--qdk-gradient) !important; } body.qikink-designer-page .qikink-designer-root .qikink_btn_icon { border-color: var(--qdk-primary) !important; background-color: var(--qdk-primary) !important; background: var(--qdk-gradient) !important; } body.qikink-designer-page .qikink-designer-root .Continue, body.qikink-designer-page .qikink-designer-root .continue-button, body.qikink-designer-page .qikink-designer-root .place_order, body.qikink-designer-page .qikink-designer-root .btn-block.place_order, body.qikink-designer-page .qikink-designer-root .addDesignButton, body.qikink-designer-page .qikink-designer-root .btn-block { background: var(--qdk-gradient) !important; background-color: var(--qdk-primary) !important; color: #fff !important; opacity: 1 !important; border: none !important; border-radius: 999px !important; } body.qikink-designer-page .qikink-designer-root .Continue:hover, body.qikink-designer-page .qikink-designer-root .continue-button:hover { filter: brightness(1.05); } /* Navbar search */ body.qikink-designer-page .qikink-designer-root .navbar .create-product-search-div .search-input:focus { border-color: var(--qdk-primary) !important; box-shadow: 0 0 0 0.2rem rgba(37, 99, 235, 0.2) !important; } body.qikink-designer-page .qikink-designer-root .navbar .create-product-search-div .go-button { background-color: var(--qdk-primary) !important; background: var(--qdk-gradient) !important; } body.qikink-designer-page .qikink-designer-root .navbar .user-info-name { color: var(--qdk-primary) !important; } /* Tabs / stepper */ body.qikink-designer-page .qikink-designer-root .nav-link-for-tab.active { color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-designer-root .tab-switch-container .create-product-title-tabs .category-nav-item .nav-link.active { color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-designer-root .tab-switch-container .back-button .qikink_btn_back_icon { background: var(--qdk-gradient) !important; background-color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-designer-root .tab-switch-container .create-product-title-tabs .qikink_btn_icon { border-color: var(--qdk-primary) !important; background-color: var(--qdk-primary) !important; background: var(--qdk-gradient) !important; } /* Surfaces (was cream #fffced / #fff6ee / #faf7f3) */ body.qikink-designer-page .qikink-designer-root .scFullSize { background-color: var(--qdk-surface) !important; background-image: none !important; } body.qikink-designer-page .qikink-designer-root .card { background-color: var(--qdk-surface) !important; } body.qikink-designer-page .qikink-designer-root .set-imgcenter { background-image: linear-gradient(var(--qdk-surface-soft), #fff) !important; box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08) !important; } body.qikink-designer-page .qikink-designer-root .change-background.bg-white, body.qikink-designer-page .qikink-designer-root .tab-switch-container .bg-white { background-color: var(--qdk-surface) !important; } /* createProduct.css */ body.qikink-designer-page .qikink-designer-root .selected { border-color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-designer-root .btn-upload-image { color: var(--qdk-primary) !important; border-color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-designer-root input[type="checkbox"] { accent-color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-designer-root .myDropzoneSectionOne, body.qikink-designer-page .qikink-designer-root .myDropzoneSectionTwo { border-color: var(--qdk-primary) !important; background-color: rgba(37, 99, 235, 0.04) !important; } body.qikink-designer-page .qikink-designer-root .color-button.selectedColorButton, body.qikink-designer-page .qikink-designer-root .size-button.selected { border-color: var(--qdk-primary) !important; color: var(--qdk-primary) !important; } /* Generic: any remaining ff6700 text/border in root */ body.qikink-designer-page .qikink-designer-root a[style*="ff6700"], body.qikink-designer-page .qikink-designer-root .text-primary { color: var(--qdk-primary) !important; } /* Loader spinner — align with brand */ body.qikink-designer-page .qikink-designer-root .pro-loader { border-top-color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-designer-root .pro-loader::after { border-left-color: var(--qdk-accent) !important; } /* SweetAlert2 attaches to , not inside .qikink-designer-root */ body.qikink-designer-page .swal2-title { color: var(--qdk-primary) !important; font-family: inherit !important; } body.qikink-designer-page .swal2-confirm { background-color: var(--qdk-primary) !important; background: var(--qdk-gradient) !important; border-radius: 999px !important; } body.qikink-designer-page .swal2-confirm:hover { background-color: var(--qdk-primary-hover) !important; filter: brightness(1.05); } body.qikink-designer-page .swal2-close { color: var(--qdk-primary) !important; } body.qikink-designer-page .qikink-icon-color { color: var(--qdk-primary) !important; }