/* ── Copilot-style AI thinking animation ──────────────────────────── */
@keyframes thinkingShimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}
@keyframes thinkingCursorBlink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}
.thinking-shimmer {
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: thinkingShimmer 2s linear infinite;
  display: inline;
}
.thinking-shimmer-light {
  background-image: linear-gradient(
    90deg,
    #1e293b 0%,
    #475569 20%,
    #94a3b8 42%,
    #e2e8f0 50%,
    #94a3b8 58%,
    #475569 80%,
    #1e293b 100%
  );
}
.thinking-shimmer-dark {
  background-image: linear-gradient(
    90deg,
    #64748b 0%,
    #94a3b8 20%,
    #f1f5f9 42%,
    #ffffff 50%,
    #f1f5f9 58%,
    #94a3b8 80%,
    #64748b 100%
  );
}
.thinking-cursor {
  animation: thinkingCursorBlink 0.7s step-end infinite;
  display: inline-block;
  font-weight: 300;
  margin-left: 1px;
}
/* ─────────────────────────────────────────────────────────────────── */

/* CSS Variables for theming - matches index.html */
:root {
	--color-bg: #f8f9fa;
	--color-surface: #ffffff;
	--color-primary: #7c3aed;
	--color-secondary: #10b981;
	--color-accent: #3b82f6;
	--color-text-primary: #1f2937;
	--color-text-secondary: #6b7280;
	--color-border: #e5e7eb;
	--color-subtle: #f3f4f6;
	--color-backdrop: rgba(0, 0, 0, 0.5);
}

/* Force scrollbar to always be visible to prevent layout shift */
html {
	margin: 0;
	padding: 0;
	overflow-y: scroll; /* Always show vertical scrollbar */
	scrollbar-gutter: stable; /* Reserve space for scrollbar consistently */
}

/* Clean white background for admin — portal has its own gradient in PortalLayout */
body {
	margin: 0;
	padding: 0;
	background: #ffffff;
	min-height: 100vh;
	width: 100%;
}

/* Branded gradient background — top white fading to pastel brand colors at bottom.
   Color is driven by --branded-bg CSS var set by JS (see App.tsx + SettingsTab).
   Uses background-attachment:fixed so the gradient is anchored to the viewport. */
body.branded-bg {
	background: var(
		--branded-bg,
		linear-gradient(to bottom, #ffffff 0%, #ffffff 40%, rgba(124,58,237,0.04) 62%, rgba(124,58,237,0.07) 78%, rgba(124,58,237,0.10) 100%)
	);
	background-attachment: fixed;
}

#root {
	width: 100%;
	min-width: 0;
}

/* Hide scrollbar utility class */
.scrollbar-none {
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE/Edge */
}
.scrollbar-none::-webkit-scrollbar {
	display: none; /* Chrome/Safari/Opera */
}

/* Glassy scrollbar — thin, dark navy thumb */
.scrollbar-glass {
	scrollbar-width: thin;
	scrollbar-color: rgba(15,23,42,0.55) rgba(15,23,42,0.06);
}
.scrollbar-glass::-webkit-scrollbar {
	width: 5px;
}
.scrollbar-glass::-webkit-scrollbar-track {
	background: rgba(15,23,42,0.06);
	border-radius: 99px;
}
.scrollbar-glass::-webkit-scrollbar-thumb {
	background: rgba(15,23,42,0.55);
	border-radius: 99px;
}
.scrollbar-glass::-webkit-scrollbar-thumb:hover {
	background: rgba(15,23,42,0.8);
}

/* Thin scrollbar utility class - hidden until hover */
.scrollbar-thin {
	scrollbar-width: thin; /* Firefox - always reserve space */
	scrollbar-color: transparent transparent; /* Firefox - invisible by default */
}
.scrollbar-thin::-webkit-scrollbar {
	width: 4px;
	height: 4px;
}
.scrollbar-thin::-webkit-scrollbar-track {
	background: transparent;
}
.scrollbar-thin::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0);
	border-radius: 4px;
	opacity: 0;
	transition: opacity 0.18s ease, background-color 0.18s ease;
}
.scrollbar-thin:hover {
	scrollbar-color: rgba(0, 0, 0, 0.2) transparent; /* Firefox - visible on hover */
}
.scrollbar-thin:hover::-webkit-scrollbar-thumb {
	opacity: 1;
	background-color: rgba(0, 0, 0, 0.2);
}
.scrollbar-thin:hover::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, 0.3);
}

/* Thin scrollbar utility class - always visible (no layout shift) */
.scrollbar-thin-stable {
	scrollbar-width: thin; /* Firefox */
	scrollbar-color: rgba(0, 0, 0, 0.15) transparent; /* Firefox */
}
.scrollbar-thin-stable::-webkit-scrollbar {
	width: 6px;
}
.scrollbar-thin-stable::-webkit-scrollbar-track {
	background: transparent;
}
.scrollbar-thin-stable::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.15);
	border-radius: 4px;
}
.scrollbar-thin-stable::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, 0.25);
}

/* Nuclear: suppress ALL focus outlines inside the mockup modal */
[data-modal-content="true"] *:focus,
[data-modal-content="true"] *:focus-visible,
[data-modal-content="true"] *:focus-within {
	outline: none !important;
	box-shadow: none !important;
}

/* Remove ALL focus outlines inside the mockup preview canvas scroll area */
.scrollbar-mockup-thin,
.scrollbar-mockup-thin:focus,
.scrollbar-mockup-thin:focus-visible,
.scrollbar-mockup-thin * {
	outline: none !important;
}

/* Remove focus outline on Konva canvas elements inside mockup preview */
.konva-stage-container canvas,
.konva-stage-container canvas:focus,
.konva-stage-container canvas:focus-visible,
.konva-stage-container canvas:active,
.konva-stage-container .konvajs-content,
.konva-stage-container .konvajs-content:focus,
.konva-stage-container .konvajs-content:focus-visible,
.konvajs-content,
.konvajs-content:focus,
.konvajs-content:focus-visible,
.konvajs-content canvas {
	outline: none !important;
	border: none !important;
	box-shadow: none !important;
}

/* Mockup preview scrollbar - thin, always visible */
.scrollbar-mockup-thin {
	scrollbar-width: thin;
	scrollbar-color: rgba(0, 0, 0, 0.35) transparent;
}
.scrollbar-mockup-thin::-webkit-scrollbar {
	width: 3px;
	height: 3px;
}
.scrollbar-mockup-thin::-webkit-scrollbar-track {
	background: transparent;
}
.scrollbar-mockup-thin::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.35);
	border-radius: 2px;
}
.scrollbar-mockup-thin::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, 0.5);
}

/* Mockup preview scrollbar - hidden until parent group is hovered */
.scrollbar-mockup-autohide {
	scrollbar-width: thin;
	scrollbar-color: transparent transparent;
	transition: scrollbar-color 0.2s;
}
.scrollbar-mockup-autohide::-webkit-scrollbar {
	width: 3px;
	height: 3px;
}
.scrollbar-mockup-autohide::-webkit-scrollbar-track {
	background: transparent;
}
.scrollbar-mockup-autohide::-webkit-scrollbar-thumb {
	background-color: transparent;
	border-radius: 2px;
	transition: background-color 0.2s;
}
/* Show when the element itself (sidebar) is hovered */
.scrollbar-mockup-autohide:hover {
	scrollbar-color: rgba(0, 0, 0, 0.35) transparent;
}
.scrollbar-mockup-autohide:hover::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.35);
}
.scrollbar-mockup-autohide:hover::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, 0.5);
}
/* Show when the named group wrapper is hovered — JS adds .canvas-area-hovered to the parent */
.canvas-area-hovered .scrollbar-mockup-autohide {
	scrollbar-color: rgba(0, 0, 0, 0.35) transparent;
}
.canvas-area-hovered .scrollbar-mockup-autohide::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.35);
}
.canvas-area-hovered .scrollbar-mockup-autohide::-webkit-scrollbar-thumb:hover {
	background-color: rgba(0, 0, 0, 0.5);
}

/* Zoom slider: hidden by default, revealed when preview area is hovered */
.canvas-area-hovered .zoom-slider-panel {
	opacity: 1 !important;
}

/* Optional subtle noise overlay for depth */
body:before {
	content: '';
	position: fixed;
	inset: 0;
	pointer-events: none;
	background-image: radial-gradient(circle at 1px 1px, rgba(0,0,0,0.04) 1px, transparent 0);
	background-size: 12px 12px;
	opacity: 0.35;
}

/* Fullscreen expand animation for mockup preview */
@keyframes expand-fullscreen {
	0% {
		transform: scale(0.92);
		opacity: 0.8;
	}
	100% {
		transform: scale(1);
		opacity: 1;
	}
}

@keyframes shrink-from-fullscreen {
	0% {
		transform: scale(1);
		opacity: 1;
	}
	100% {
		transform: scale(0.95);
		opacity: 0.9;
	}
}

.animate-expand-fullscreen {
	animation: expand-fullscreen 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.animate-shrink-from-fullscreen {
	animation: shrink-from-fullscreen 0.25s cubic-bezier(0.4, 0, 0.2, 1) forwards;
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Subtle slow pulse for active progress bar segment */
@keyframes progress-pulse {
	0%, 100% {
		opacity: 1;
	}
	50% {
		opacity: 0.4;
	}
}
.animate-progress-pulse {
	animation: progress-pulse 4s ease-in-out infinite;
}

/* Gold pulse glow for newly synced designs */
@keyframes pulse-gold {
	0%, 100% {
		box-shadow: 0 0 20px rgba(251, 191, 36, 0.5), 0 0 40px rgba(251, 191, 36, 0.3);
	}
	50% {
		box-shadow: 0 0 30px rgba(251, 191, 36, 0.7), 0 0 60px rgba(251, 191, 36, 0.4);
	}
}

/* Mobile slide-up modal animation */
@keyframes slide-up {
	0% {
		transform: translateY(100%);
		opacity: 0.9;
	}
	100% {
		transform: translateY(0);
		opacity: 1;
	}
}

.animate-slide-up {
	animation: slide-up 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

/* Compose panel slide-down close animation */
@keyframes slide-down {
	0% {
		transform: translateY(0);
		opacity: 1;
	}
	100% {
		transform: translateY(100%);
		opacity: 0.9;
	}
}

.animate-slide-down {
	animation: slide-down 0.25s cubic-bezier(0.4, 0, 1, 1) forwards;
}

/* Modal zoom-in animation */
@keyframes zoomIn {
	0% {
		transform: scale(0.95);
		opacity: 0;
	}
	100% {
		transform: scale(1);
		opacity: 1;
	}
}

/* Command palette entrance animation */
@keyframes commandPaletteIn {
	0% {
		transform: scale(0.96) translateY(-8px);
		opacity: 0;
	}
	100% {
		transform: scale(1) translateY(0);
		opacity: 1;
	}
}

.animate-command-palette-in {
	animation: commandPaletteIn 0.15s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

@keyframes fadeOut {
	0% { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes zoomOut {
	0% {
		transform: scale(1);
		opacity: 1;
	}
	100% {
		transform: scale(0.95);
		opacity: 0;
	}
}

/* Marquee animation for long text on hover - scrolls right to left */
@keyframes marquee {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100%);
	}
}

.group-hover\:animate-marquee:hover,
.group:hover .group-hover\:animate-marquee {
	animation: marquee 6s linear infinite;
}

/* Mobile scroll improvements */
@media (max-width: 768px) {
	html, body {
		-webkit-overflow-scrolling: touch;
	}
	
	/* Prevent pull-to-refresh and horizontal overscroll but allow normal scrolling */
	body {
		overscroll-behavior-x: none;
	}
	
	/* Ensure sidebar content scrolls properly */
	.sidebar-content {
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
	}
}

/* Body scroll lock utility - applied via JS when sidebar is open */
body.sidebar-open {
	overflow: hidden !important;
	touch-action: none !important;
	position: fixed;
	width: 100%;
}

/* ============================================
   MOBILE-FIRST RESPONSIVE UTILITIES
   ============================================ */

/* Hide scrollbar but allow scrolling */
.scrollbar-hide {
	-ms-overflow-style: none;
	scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
	display: none;
}

/* Mobile-specific styles */
@media (max-width: 767px) {
	/* Allow main content to scroll horizontally if needed */
	main {
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
	}
	
	/* Make tables scrollable on mobile */
	.table-container {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		max-width: 100%;
	}
	
	/* Stack flex items on mobile */
	.mobile-stack {
		flex-direction: column !important;
	}
	
	/* Full width buttons on mobile */
	.mobile-full-btn {
		width: 100% !important;
	}
	
	/* Reduce padding on mobile */
	.mobile-p-2 {
		padding: 0.5rem !important;
	}
	
	/* Hide on mobile */
	.hide-mobile {
		display: none !important;
	}
	
	/* Smaller text on mobile */
	.mobile-text-sm {
		font-size: 0.875rem !important;
	}
	
	/* Card grid adjustments */
	.order-card-grid {
		display: flex !important;
		flex-direction: column !important;
		gap: 0.5rem !important;
	}
}

/* Tablet breakpoint */
@media (min-width: 768px) and (max-width: 1023px) {
	/* Two-column grids on tablet */
	.tablet-2-col {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

/* Ensure horizontal scroll containers work well */
.horizontal-scroll {
	display: flex;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x mandatory;
	gap: 0.5rem;
	padding-bottom: 0.5rem;
}

.horizontal-scroll > * {
	scroll-snap-align: start;
	flex-shrink: 0;
}

/* Mobile-friendly modal */
@media (max-width: 767px) {
	.mobile-modal {
		width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		max-height: 100% !important;
		border-radius: 0 !important;
		margin: 0 !important;
	}
	
	.mobile-modal-content {
		height: 100%;
		display: flex;
		flex-direction: column;
	}
	
	/* Bottom sheet style modal */
	.mobile-bottom-sheet {
		position: fixed !important;
		bottom: 0 !important;
		left: 0 !important;
		right: 0 !important;
		top: auto !important;
		max-height: 90vh !important;
		border-radius: 1rem 1rem 0 0 !important;
		animation: slide-up 0.3s ease-out;
	}
}

/* Touch-friendly tap targets */
@media (max-width: 767px) {
	button, 
	a, 
	select, 
	input[type="checkbox"],
	input[type="radio"],
	.tap-target {
		min-height: 44px;
		min-width: 44px;
	}
	
	/* Larger touch targets for interactive elements */
	.touch-target {
		padding: 0.75rem !important;
	}
}

/* Google Places Autocomplete dropdown styling */
.pac-container {
	z-index: 200000 !important;
	border-radius: 0.75rem;
	border: 1px solid #e5e7eb;
	box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
	margin-top: 4px;
	font-family: inherit;
}

/* Override Google PlaceAutocompleteElement styles */
.google-address-wrapper gmp-place-autocomplete {
	display: block !important;
	width: 100% !important;
}

.google-address-wrapper gmp-place-autocomplete input,
.google-address-wrapper input[type="text"] {
	width: 100% !important;
	padding: 14px 70px 14px 16px !important;
	border: 2px solid #e2e8f0 !important;
	border-radius: 10px !important;
	font-size: 15px !important;
	font-family: inherit !important;
	outline: none !important;
	transition: border-color 0.2s, box-shadow 0.2s !important;
	background: white !important;
	box-sizing: border-box !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.google-address-wrapper gmp-place-autocomplete input:focus,
.google-address-wrapper input[type="text"]:focus {
	border-color: #7c3aed !important;
	box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15) !important;
}

.google-address-wrapper gmp-place-autocomplete input::placeholder,
.google-address-wrapper input[type="text"]::placeholder {
	color: #94a3b8 !important;
}

/* Hide Google's built-in icons and buttons */
.google-address-wrapper gmp-place-autocomplete svg,
.google-address-wrapper gmp-place-autocomplete [class*="icon"],
.google-address-wrapper gmp-place-autocomplete button:not(.pointer-events-auto) {
	display: none !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
	opacity: 0 !important;
}

.pac-item {
	padding: 0.75rem 1rem;
	cursor: pointer;
	border-top: 1px solid #f3f4f6;
	font-size: 0.875rem;
}

.pac-item:first-child {
	border-top: none;
}

.pac-item:hover {
	background-color: #f3f4f6;
}

.pac-item-selected,
.pac-item-selected:hover {
	background-color: #ede9fe;
}

.pac-icon {
	margin-right: 0.75rem;
}

.pac-item-query {
	font-weight: 500;
	color: #1f2937;
}

.pac-matched {
	font-weight: 600;
	color: #7c3aed;
}

/* Fly-to-folder drop animation for design moves */
@keyframes flyToFolder {
	0% {
		transform: translate(0, 0) scale(1);
		opacity: 1;
	}
	70% {
		transform: translate(var(--end-x), var(--end-y)) scale(0.6);
		opacity: 0.9;
	}
	100% {
		transform: translate(var(--end-x), var(--end-y)) scale(0.3);
		opacity: 0;
	}
}

/* Holographic shimmer animation for sticker preview */
@keyframes holo-shimmer {
	from { --holo-angle: 0deg; }
	to { --holo-angle: 360deg; }
}

/* Aurora background animation (used by AuroraBackground component) */
@keyframes aurora {
	0%   { background-position: 0% 50%, 0% 50%; }
	50%  { background-position: 100% 50%, 100% 50%; }
	100% { background-position: 0% 50%, 0% 50%; }
}

/* Clouds marquee (hero theme) — scrolls by -50% over duplicated content for seamless loop */
@keyframes clouds-seamless-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* Sticker hero float gentle rotation */
@keyframes sticker-float-shimmer {
	from { --holo-angle: 0deg; }
	to   { --holo-angle: 360deg; }
}

@property --holo-angle {
	syntax: '<angle>';
	initial-value: 0deg;
	inherits: true;
}

.animate-holo-shimmer {
	animation: holo-shimmer 14.4s linear infinite;
}

/* Sparkle burst animation for favorite button */
@keyframes sparkle-burst {
	0% {
		transform: translate(-50%, -50%) scale(1);
		opacity: 1;
	}
	100% {
		transform: translate(
			calc(-50% + cos(var(--angle)) * var(--distance)),
			calc(-50% + sin(var(--angle)) * var(--distance))
		) scale(0);
		opacity: 0;
	}
}

/* Alternative sparkle animation using radial pattern */
.sparkle-particle {
	animation: sparkle-fly 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

@keyframes sparkle-fly {
	0% {
		transform: translate(-50%, -50%) scale(1) rotate(0deg);
		opacity: 1;
	}
	50% {
		opacity: 1;
	}
	100% {
		transform: translate(
			calc(-50% + cos(var(--angle)) * var(--distance)),
			calc(-50% + sin(var(--angle)) * var(--distance))
		) scale(0) rotate(180deg);
		opacity: 0;
	}
}

/* Pulse glow for favorited items */
@keyframes favorite-glow {
	0%, 100% {
		box-shadow: 0 0 8px 2px rgba(251, 191, 36, 0.4);
	}
	50% {
		box-shadow: 0 0 16px 4px rgba(251, 191, 36, 0.6);
	}
}

/* Background-removal shimmer overlay (layer thumbnail + full-size) */
@keyframes _sbg_sweep {
	0%   { transform: translateY(-120%); }
	100% { transform: translateY(420%); }
}
@keyframes _sbg_fog_drift {
	0%   { transform: translateY(-8%)  scale(1.04); }
	50%  { transform: translateY(6%)   scale(1.08); }
	100% { transform: translateY(-8%)  scale(1.04); }
}


/* Pocket zone animated diagonal march — CSS-only, no React re-renders */
@keyframes _pocket_march {
	from { background-position: 0 0; }
	to   { background-position: -14.14px -14.14px; }
}

/* Instagram story ring gradient spin */
@keyframes storyRingSpin {
	to { transform: rotate(360deg); }
}

/* Instagram story progress bar — drives the 5s auto-advance without JS re-renders */
@keyframes storyProgressBar {
	from { width: 0% }
	to { width: 100% }
}

/* ── Suppress Chrome native video overlay controls (banner/gallery background videos) */
video::-webkit-media-controls,
video::-webkit-media-controls-enclosure,
video::-webkit-media-controls-panel,
video::-webkit-media-controls-overlay-cast-button,
video::-webkit-media-controls-overlay-play-button,
video::-webkit-media-controls-play-button,
video::-webkit-media-controls-timeline,
video::-webkit-media-controls-current-time-display,
video::-webkit-media-controls-time-remaining-display,
video::-webkit-media-controls-mute-button,
video::-webkit-media-controls-toggle-closed-captions-button,
video::-webkit-media-controls-volume-slider,
video::-webkit-media-controls-fullscreen-button,
video::-webkit-media-controls-overflow-button,
video::-internal-media-controls-overflow-button,
video::-webkit-media-controls-playback-speed-button {
  display: none !important;
  -webkit-appearance: none;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Suppress Chrome playback-speed badge / pip overlay */
video::--webkit-media-text-track-container,
video::-webkit-media-controls-timeline-container {
  display: none !important;
}

/* =====================================================
   Rich Text Brief Editor
   ===================================================== */
.rich-text-editor:empty::before,
.rich-text-editor.empty-placeholder:not(:focus)::before {
	content: attr(data-placeholder);
	color: #9ca3af;
	pointer-events: none;
	position: absolute;
}

.rich-text-editor h1 {
	font-size: 1.5em;
	font-weight: 700;
	margin: 0.4em 0;
	line-height: 1.3;
}

.rich-text-editor h2 {
	font-size: 1.25em;
	font-weight: 600;
	margin: 0.35em 0;
	line-height: 1.35;
}

.rich-text-editor h3 {
	font-size: 1.1em;
	font-weight: 600;
	margin: 0.3em 0;
}

.rich-text-editor p {
	margin: 0.3em 0;
}

.rich-text-editor ul,
.rich-text-editor ol {
	margin: 0.3em 0;
	padding-left: 1.5em;
}

.rich-text-editor ul {
	list-style-type: disc;
}

.rich-text-editor ol {
	list-style-type: decimal;
}

.rich-text-editor li {
	margin: 0.15em 0;
}

.rich-text-editor b,
.rich-text-editor strong {
	font-weight: 700;
}

.rich-text-editor i,
.rich-text-editor em {
	font-style: italic;
}

.rich-text-editor u {
	text-decoration: underline;
}

.rich-text-editor s,
.rich-text-editor strike {
	text-decoration: line-through;
}

/* Square Web Payments SDK - compact card form */
.sq-card-compact iframe {
	height: 96px !important;
	min-height: 96px !important;
	max-height: 96px !important;
}
.sq-card-compact {
	border: 1px solid #e5e7eb;
	border-radius: 0.5rem;
	overflow: hidden;
	height: 96px;
	min-height: 96px;
	max-height: 96px;
	background: #ffffff;
}
.sq-card-compact > div {
	height: 96px !important;
	min-height: 96px !important;
	max-height: 96px !important;
	overflow: hidden !important;
}