/* Phase BY: global Maersk-style radius system.
   Reference: restrained radius, squared-off cards/buttons.

   NO CAPSULES (brand rule). Nothing rectangular is fully rounded any more —
   buttons, filters, tabs, toggles, segmented controls, badges, tags, chips and
   legend labels all take the BUTTON radius. `--radius-pill` survives for the
   shapes where a full round is the shape itself: circles (avatars, one-glyph
   icon buttons, step numbers, dots) and the end caps of thin progress bars. */
:root {
  --radius: 12px;
  --radius-lg: 12px;
  --radius-xl: 12px;
  --radius-btn: 8px;
  --radius-control: 8px;
  --radius-card: 12px;
  --radius-panel: 12px;
  --radius-pill: 9999px;
  --qf-maersk-radius-card: 12px;
  --qf-maersk-radius-control: 8px;
  --qf-maersk-radius-button: 8px;
}

/* Wave 4 — widget theme structural tokens re-map the CALCULATOR's radius scale.
   Scoped to body.qf-app-calculator so it only takes effect inside the widget
   iframe (where widget.js has set --w-radius-*); every other surface on the
   site keeps the global :root fallbacks above, unchanged. The fallbacks equal
   the current values, so the default (Midnight) shell stays pixel-for-pixel
   identical. Presets like Onyx (2px, sharp) / Cupertino (14–18px, soft) now
   restyle the whole card, inputs, buttons and chips — not just the colour. */
body.qf-app-calculator {
  --qf-maersk-radius-card: var(--w-radius-card, 8px);
  --qf-maersk-radius-control: var(--w-radius-input, 6px);
  --qf-maersk-radius-button: var(--w-radius-btn, 4px);
  --radius-pill: var(--w-radius-pill, 999px);
}

.card,
.price-card,
.support-card,
.support-note,
.support-table,
.ct-card,
.footer-note,
.qf-panel,
.qf-card,
.app-card,
.metric-card,
.rate-card,
.lead-card,
.tool-card,
.mp-card,
.mp-empty,
.feature-card,
.final-cta-card,
.compare-card,
.pdf-card,
.scheduler-card,
.chat-demo,
.faq-item,
.simple-step,
.table,
.notice,
.tabs,
.modal,
.drawer,
.dropdown,
.popover,
body.qf-wft .visual-flow,
body.qf-wft .flow-card,
body.qf-wft .simple-step,
body.qf-wft .final-cta-card,
body.qf-wft .step-art,
body.qf-wft .site-mini,
body.qf-wft .email-mini,
body.qf-wft .url-chip,
body.qf-wft .share-strip span,
body.qf-wft .mini-checks span,
body.qf-wft .premium-footer,
body.qf-auth-wft .card.elevated,
body.qf-public-wft .price-card,
body.qf-public-wft .support-card,
body.qf-public-wft .support-note,
body.qf-public-wft .support-table,
body.qf-public-wft .sec-shell .ct-card,
body.qf-public-wft .sec-shell .footer-note {
  border-radius: var(--qf-maersk-radius-card) !important;
}

.btn,
button.btn,
.btn-primary,
.btn-secondary,
.btn-ghost,
.btn-danger,
.qf-cta,
.qf-chat-send,
.qf-mc-send,
button[type="submit"],
body.qf-wft .btn-primary,
body.qf-wft .btn-secondary,
body.qf-auth-wft .btn-primary,
body.qf-public-wft .btn-primary,
body.qf-public-wft .btn-secondary {
  border-radius: var(--qf-maersk-radius-button) !important;
}

.input,
.select,
.textarea,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select,
textarea,
.url-builder-preview,
.typeahead-list,
.qf-input,
.qf-select,
.qf-suggestions,
.qf-chat,
.qf-chat-input-row input,
.qf-mc-input,
body.qf-auth-wft .input,
body.qf-auth-wft .select,
body.qf-auth-wft .url-builder-preview {
  border-radius: var(--qf-maersk-radius-control) !important;
}

.badge,
.tag,
.pill,
.chip,
.mp-pill,
.qf-trust-chip {
  border-radius: var(--qf-maersk-radius-button) !important;
}

/* The two genuinely ROUND members of the old pill group. `.qf-help` is a 24px
   "?" disc holding one glyph and `.qf-mc-bubble` is the chat launcher — both are
   circles, which the no-capsule rule allows; it is the capsule that is banned. */
.qf-help,
.qf-mc-bubble {
  border-radius: 9999px !important;
}

.brand-mark .logo,
.site-logo,
.qf-demo-logo-slot,
.qf-header img,
.qf-brand-mark,
.logo,
body.qf-wft .site-logo,
body.qf-wft .logo,
body.qf-auth-wft .logo,
body.qf-public-wft .brand-mark .logo {
  border-radius: var(--qf-maersk-radius-control) !important;
}

.qf-tabs,
.qf-options-panel,
.qf-booking-card,
.qf-oog-panel,
.qf-conditional-panel,
.qf-result,
.qf-chat,
.qf-demo-brand-card,
.qf-demo-brand-editor,
.qf-demo-logo-upload,
body.qf-app-calculator .qf-widget,
body.qf-app-calculator .qf-tabs,
body.qf-app-calculator .qf-options-panel,
body.qf-app-calculator .qf-booking-card,
body.qf-app-calculator .qf-oog-panel,
body.qf-app-calculator .qf-conditional-panel,
body.qf-app-calculator .qf-result,
body.qf-app-calculator .qf-chat,
body.qf-app-calculator .qf-demo-brand-card,
body.qf-app-calculator .qf-demo-brand-editor {
  border-radius: var(--qf-maersk-radius-card) !important;
}

.qf-tabs button,
.qf-acc-chip,
.qf-flags label,
.qf-demo-brand-editor-head button,
body.qf-app-calculator .qf-tabs button,
body.qf-app-calculator .qf-acc-chip,
body.qf-app-calculator .qf-flags label,
body.qf-app-calculator .qf-cta,
body.qf-app-calculator .qf-options-panel .qf-flags label,
body.qf-app-calculator .qf-options-panel .qf-acc-chip {
  border-radius: var(--qf-maersk-radius-button) !important;
}

.qf-chat-bubble,
.qf-mc-bubble-msg {
  border-radius: var(--qf-maersk-radius-card) !important;
}

.qf-chat-bubble.user,
.qf-mc-bubble-msg.user {
  border-bottom-right-radius: var(--qf-maersk-radius-button) !important;
}

.qf-chat-bubble.assistant,
.qf-mc-bubble-msg.assistant {
  border-bottom-left-radius: var(--qf-maersk-radius-button) !important;
}