/*-------------------------------------------------- Responsive Adjustments --------------------------------------------------*/ @media (max-width: 1024px) { .car-widget .filter-sort-wrap[data-v-4cd715a2] { top: 59.2px !important; } } /*-------------------------------------------------- General Styles --------------------------------------------------*/ .hubspot-form-embed { display: none; } field_dropdown:valid { color: #002D25; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; } select:valid { color: black; } .is-trading { height: 0px; overflow: hidden; display: none; } /*-------------------------------------------------- Progress Bar Styles --------------------------------------------------*/ [data-step-progress="back"] { margin-left: -1.95rem; opacity: 0; } [data-step-progress="back"].is-visible { margin-left: 0rem; opacity: 1; } /*-------------------------------------------------- Company Lookup Styles --------------------------------------------------*/ [data-company-search="list"] { opacity: 0; visibility: hidden; display: none; transition: opacity 0.3s ease; } [data-company-search="list"].active { height: 8.4rem; opacity: 1; transform: translateY(0); visibility: visible; display: flex; flex-direction: column; border-width: 0px 1px 1px 1px; border-style: solid; border-color: var(--_color-modes---scale--scale-4); padding-top: 0.5rem; box-shadow: 0 0 #57575700, 0 .9px .6px #5757570f, 0 2.1px 1.7px #57575711, 0 4.6px 4.5px #57575712, 0 11.3px 13.4px #57575714; border-radius: 0px 0px 1rem 1rem; } [data-company-search="list"].active~.field_combobox { border-radius: 0; border-style: solid; border-bottom: 1px solid white; border-radius: 1rem 1rem 0px 0px; } [data-company-search="list"].active~.field_combobox::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, #fff 2%, #c0c0c0 2% 98%, #fff 98%); z-index: 1; } .company-search-item, .company-search-custom { cursor: pointer; transition: background-color 0.2s ease; padding: 0.5rem; height: 3rem; display: flex; align-items: center; font-size: 1rem; } .company-search-item:hover, .company-search-custom:hover { background-color: rgba(9, 104, 246, 0.2); } [data-company-search="list"].loading { opacity: 1; visibility: visible; display: flex; overflow: hidden; } /* Skeleton Loading Styles */ .company-search_skeleton-loading { display: none; padding: 0.5rem; } [data-company-search="list"].loading .company-search_skeleton-loading { display: flex; } .company-search_skeleton-item { background-image: linear-gradient(90deg, #f0f0f0 0%, #e0e0e0 50%, #f0f0f0 100%); background-size: 200% 100%; animation: shimmer 1.5s infinite; height: 1.5rem; margin-bottom: 0.5rem; border-radius: 4px; } .company-search_skeleton-item:nth-child(2) { width: 75%; } .company-search_skeleton-item:nth-child(3) { width: 50%; } @keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } [data-company-search="loading"] { visibility: hidden !important; opacity: 0 !important; transition: opacity 0.3s ease, visibility 0.3s ease; } /*-------------------------------------------------- Multi-Step Form Styles --------------------------------------------------*/ [data-form="step"].hiding { opacity: 0; transform: translateY(-0.25rem); } [data-form="step"].showing { opacity: 0; transform: translateY(0.25rem); } div[data-form="step"]+div[data-form="step"] { display: none; } .field_error { display: none; } [data-company-trading="true"] { display: none; } [data-existing-customer] { display: none; margin-top: -4rem; } /*-------------------------------------------------- Form Input Styles --------------------------------------------------*/ /* Hide the tick by default */ .form_radio-checkbox .checkbox__inner { opacity: 0; transform: scale(0.9); transition: opacity 0.15s ease, transform 0.15s ease; } /* Style the wrapper (label) when radio is checked */ .checkbox__field-wrapper:has(input[type="radio"]:checked) { border: 1.4px solid #0968f6; background-color: rgba(0, 114, 253, 0.11); color: currentColor; } /* Reveal the checkmark when radio is checked */ .checkbox__field-wrapper:has(input[type="radio"]:checked) .checkbox__inner { opacity: 1; transform: scale(1); } .button-loader { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } /*-------------------------------------------------- Modal Visibility Styles --------------------------------------------------*/ [data-modal="hide"] { display: none !important; } .show-modal [data-modal="hide"] { display: flex !important; } .show-modal { overflow: hidden !important; } /*-------------------------------------------------- ConceptAI Report Styling --------------------------------------------------*/ .markdown-content { line-height: 1.6; color: #333; max-width: 100%; padding: 2rem 0; } /* Headings */ .markdown-content h1 { font-size: 2.5rem; font-weight: 700; margin-top: 0; margin-bottom: 1.5rem; line-height: 1.2; color: #1a1a1a; border-bottom: 2px solid #e5e5e5; padding-bottom: 0.5rem; } .markdown-content h2 { font-size: 2rem; font-weight: 600; margin-top: 2.5rem; margin-bottom: 1rem; line-height: 1.3; color: #1a1a1a; } .markdown-content h3 { font-size: 1.5rem; font-weight: 600; margin-top: 2rem; margin-bottom: 0.75rem; line-height: 1.4; color: #1a1a1a; } .markdown-content h4 { font-size: 1.25rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.5rem; line-height: 1.4; color: #1a1a1a; } /* Paragraphs */ .markdown-content p { margin-bottom: 1.25rem; font-size: 1rem; } .markdown-content p:last-child { margin-bottom: 0; } /* Bold and Italic */ .markdown-content strong { font-weight: 600; color: #1a1a1a; } .markdown-content em { font-style: italic; color: #555; } /* Lists */ .markdown-content ul, .markdown-content ol { margin-bottom: 1.25rem; padding-left: 2rem; } .markdown-content li { margin-bottom: 0.5rem; line-height: 1.6; } .markdown-content ul { list-style-type: disc; } .markdown-content ol { list-style-type: decimal; } .markdown-content ul ul, .markdown-content ol ul { list-style-type: circle; margin-top: 0.5rem; } .markdown-content ul ol, .markdown-content ol ol { margin-top: 0.5rem; } /* Tables */ .markdown-content table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 0.95rem; background-color: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); border-radius: 8px; overflow: hidden; } .markdown-content thead { background-color: #f8f9fa; } .markdown-content th { padding: 1rem; text-align: left; font-weight: 600; color: #1a1a1a; border-bottom: 2px solid #dee2e6; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.5px; } .markdown-content td { padding: 1rem; border-bottom: 1px solid #e9ecef; vertical-align: top; } .markdown-content tbody tr:last-child td { border-bottom: none; } .markdown-content tbody tr:hover { background-color: #f8f9fa; transition: background-color 0.2s ease; } /* Horizontal Rules */ .markdown-content hr { margin: 2.5rem 0; border: none; border-top: 2px solid #e5e5e5; } /* Links */ .markdown-content a { color: #0066cc; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.2s ease; } .markdown-content a:hover { border-bottom-color: #0066cc; } /* Code (if any inline code exists) */ .markdown-content code { background-color: #f5f5f5; padding: 0.2rem 0.4rem; border-radius: 3px; font-family: 'Courier New', Courier, monospace; font-size: 0.9em; color: #d63384; } /* Blockquotes (if any) */ .markdown-content blockquote { margin: 1.5rem 0; padding-left: 1.5rem; border-left: 4px solid #e5e5e5; color: #666; font-style: italic; } /* Responsive adjustments */ @media (max-width: 768px) { .markdown-content h1 { font-size: 2rem; } .markdown-content h2 { font-size: 1.75rem; } .markdown-content h3 { font-size: 1.35rem; } .markdown-content table { font-size: 0.85rem; } .markdown-content th, .markdown-content td { padding: 0.75rem; } } /* Mobile table fix - prevent horizontal page scroll */ .markdown-content { overflow-x: hidden; } .markdown-content table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */ } /* Optional: visual hint that table is scrollable */ @media (max-width: 768px) { .markdown-content table { margin-left: -0.5rem; margin-right: -0.5rem; width: calc(100% + 1rem); } } /* =================================== Toast Display & Animation Styles =================================== */ .toast { display: none; opacity: 0; transform: translateX(400px); transition: all 0.3s ease-out; } /* Loader wrapper - hidden by default */ [data-toast="loader-wrapper"] { display: none; } /* Active state - toast is visible and slides in */ .toast[data-toast-state="visible"] { display: flex !important; opacity: 1; transform: translateX(0); } /* Hiding state - toast slides out (for dismissal) */ .toast[data-toast-state="hiding"] { opacity: 0; transform: translateX(400px); transition: all 0.2s ease-in; } /* Loader wrapper shown (for session-expired toasts) */ [data-toast="loader-wrapper"][data-loader-visible="true"] { display: flex !important; } /* Circle progress animation - 3 seconds */ @keyframes toast-countdown-progress { from { stroke-dashoffset: 50.27; } to { stroke-dashoffset: 0; } } /* Active state triggers the countdown animation */ .toast__loader-progress[data-loader-active="true"] { animation: toast-countdown-progress 3s linear forwards; }