/* Canonical components. Existing pricing selectors are adapters, not copies.
   Their metrics are preserved; page layout remains in pricing-workbench.css. */
.pw-surface { --lc-control-ink: #132d4f; --lc-control-line: #e0e6ed; }
.lc-button,.pw-surface button{font-family:inherit;font-size:12px;font-weight:600;line-height:1.4;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;border:1px solid var(--lc-control-line, var(--lococo-line));border-radius:var(--lococo-radius-control,8px);padding:9px 12px;background:#fff;color:var(--lc-control-ink, var(--lococo-ink));box-shadow:none}
.lc-button--primary,.pw-surface button.primary-button{background:var(--lc-control-ink, var(--lococo-ink));color:#fff;border-color:var(--lc-control-ink, var(--lococo-ink))}
.lc-button--text,.pw-surface button.text-button{background:transparent;border-color:transparent}
.lc-button:hover:not(:disabled),.pw-surface button:hover:not(:disabled){background:var(--lococo-selected);border-color:#a7b9ce}
.lc-button--primary:hover:not(:disabled),.pw-surface button.primary-button:hover:not(:disabled){background:#24496f;color:#fff}
.lc-button:disabled,.pw-surface button:disabled{opacity:.45;cursor:not-allowed}
.pw-surface :focus-visible{outline:2px solid var(--lococo-focus,#6488b7);outline-offset:2px}
.pw-surface label,.pw-surface .form-field>label{font-size:12px;line-height:1.45;letter-spacing:0;text-transform:none;color:#4f6077;font-weight:600}
.lc-field,.pw-surface input:not([type=checkbox]),.lc-select,.pw-surface select,.lc-textarea,.pw-surface textarea{font:inherit;color:var(--lc-control-ink, var(--lococo-ink));border:1px solid var(--lococo-field-line);border-radius:var(--lococo-radius-control,8px);min-height:40px;padding:9px 11px;background:white;max-width:100%;width:100%;box-shadow:none}
.pw-surface input:disabled,.lc-select:disabled,.pw-surface select:disabled{background:var(--lococo-soft);color:#778599;opacity:1}
.pw-surface input[type=checkbox]{width:17px;height:17px;accent-color:var(--lc-control-ink, var(--lococo-ink));flex-shrink:0;margin:1px 0}

/* Direct focus and field labels also work outside an existing workspace. */
:is(.lc-button,.lc-field,.lc-select,.lc-textarea,.lc-check,.lc-tab):focus-visible { outline: 2px solid var(--lococo-focus); outline-offset: 2px; }
.lc-field,.lc-select,.lc-textarea { font-size: var(--lococo-text-md); font-weight: 400; }
.lc-button { cursor: pointer; text-decoration: none; }
.lc-button svg { width: 18px; height: 18px; flex-shrink: 0; }
.lc-button--icon { width: 40px; padding: 8px; }
.lc-label { display: grid; gap: var(--lococo-space-2); font-size: var(--lococo-text-sm); font-weight: 600; color: var(--lococo-ink); }
.lc-label > small { font-weight: 400; color: var(--lococo-muted); line-height: var(--lococo-leading-copy); }
.lc-label .lc-field[aria-invalid="true"] { border-color: var(--lococo-danger); }
.lc-label .lc-error { color: var(--lococo-danger); }
.lc-field:disabled { background: var(--lococo-soft); color: var(--lococo-muted); }
.lc-check { accent-color: var(--lococo-ink); }
.lc-panel { min-width: 0; padding: var(--lococo-space-4); border: var(--lococo-border-width) solid var(--lococo-line); border-radius: var(--lococo-radius-panel); background: var(--lococo-surface); }
.lc-stack { display: grid; gap: var(--lococo-space-4); }
.lc-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lococo-space-2); }
.lc-toolbar > .lc-field { flex: 1 1 240px; width: auto; }
.lc-tabs { display: flex; gap: var(--lococo-space-2); border-bottom: 1px solid var(--lococo-line); overflow-x: auto; overscroll-behavior-x: contain; }
.lc-tab { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 12px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--lococo-muted); font: 600 var(--lococo-text-sm)/1.4 var(--lococo-font-sans); white-space: nowrap; cursor: pointer; }
.lc-tab[aria-selected="true"] { border-bottom-color: var(--lococo-ink); color: var(--lococo-ink); }
.lc-notice { display: flex; align-items: start; gap: 10px; padding: 12px; border: 1px solid var(--lococo-line); border-radius: var(--lococo-radius-control); color: var(--lococo-ink); background: var(--lococo-soft); font-size: var(--lococo-text-sm); }
.lc-notice--warning { border-color: #ead7ad; background: #fffaf0; color: #78581c; }
.lc-notice--success { border-color: #bde0cf; background: #f0faf5; color: #166449; }
.lc-notice svg { flex-shrink: 0; width: 18px; height: 18px; }
.lc-notice strong { display: block; margin-bottom: 4px; }
.lc-empty { display: grid; justify-items: start; gap: 8px; padding: 24px; border: 1px dashed var(--lococo-line); border-radius: var(--lococo-radius-panel); color: var(--lococo-muted); }
.lc-empty strong { color: var(--lococo-ink); }
.lc-empty p { margin: 0; font-size: var(--lococo-text-sm); line-height: 1.5; }
.lc-dialog { width: min(520px, calc(100% - 24px)); max-height: calc(100dvh - 24px); padding: 20px; border: 1px solid var(--lococo-line); border-radius: var(--lococo-radius-panel); color: var(--lococo-ink); background: white; font-family: var(--lococo-font-sans); }
.lc-dialog::backdrop { background: #102b4e66; }
.lc-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lc-dialog h2 { margin: 0; font-size: var(--lococo-title-md); }
.lc-dialog footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
@media (max-width: 700px) {
  :is(.lc-button,.lc-field,.lc-select,.lc-textarea) { min-height: var(--lococo-touch-target); }
  :is(.lc-field,.lc-select,.lc-textarea) { font-size: var(--lococo-text-lg); }
  .lc-button--icon { width: var(--lococo-touch-target); }
}
@media (prefers-reduced-motion: reduce) { .lc-button,.lc-tab { transition: none; } }
