/* AUC component styles. Consumers get these free by linking styles.css. */
/* ---------- Button ---------- */
.auc-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);font-family:var(--font-sans);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-tight);border:var(--border-thick) solid transparent;border-radius:var(--radius-btn);cursor:pointer;text-decoration:none;transition:var(--transition-control);white-space:nowrap}
.auc-btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.auc-btn:active{transform:translateY(1px)}
.auc-btn--sm{font-size:var(--text-sm);padding:8px 16px}
.auc-btn--md{font-size:var(--text-base);padding:12px 24px}
.auc-btn--lg{font-size:var(--text-lg);padding:16px 32px}
.auc-btn--primary{background:var(--action-primary);color:var(--text-on-accent);border-color:var(--action-primary)}
.auc-btn--primary:hover{background:var(--action-primary-hover);border-color:var(--action-primary-hover)}
.auc-btn--primary:active{background:var(--action-primary-active)}
.auc-btn--accent{background:var(--action-accent);color:var(--text-on-accent);border-color:var(--action-accent)}
.auc-btn--accent:hover{background:var(--action-accent-hover);border-color:var(--action-accent-hover)}
.auc-btn--accent:active{background:var(--action-accent-active)}
.auc-btn--secondary{background:var(--action-secondary-bg);color:var(--text-brand);border-color:var(--action-secondary-border)}
.auc-btn--secondary:hover{background:var(--action-secondary-hover-bg)}
.auc-btn--ghost{background:transparent;color:var(--text-brand);border-color:transparent}
.auc-btn--ghost:hover{background:var(--action-ghost-hover-bg)}
.auc-btn--inverse{background:var(--paper-050);color:var(--blue-900);border-color:var(--paper-050)}
.auc-btn--inverse:hover{background:#fff;border-color:#fff}
.auc-btn--inverse:focus-visible{box-shadow:var(--focus-ring-inverse)}
.auc-btn[disabled],.auc-btn[aria-disabled="true"]{background:var(--action-disabled-bg);border-color:var(--action-disabled-bg);color:var(--action-disabled-text);cursor:not-allowed;transform:none}
.auc-btn--block{width:100%}
/* ---------- IconButton ---------- */
.auc-iconbtn{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);border:var(--border-hairline) solid transparent;background:transparent;color:var(--text-brand);cursor:pointer;transition:var(--transition-control)}
.auc-iconbtn--sm{width:32px;height:32px}.auc-iconbtn--md{width:40px;height:40px}.auc-iconbtn--lg{width:48px;height:48px}
.auc-iconbtn:hover{background:var(--action-ghost-hover-bg)}
.auc-iconbtn:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.auc-iconbtn--outline{border-color:var(--border-default);background:var(--surface-card)}
.auc-iconbtn--solid{background:var(--action-primary);color:var(--text-on-accent)}
.auc-iconbtn--solid:hover{background:var(--action-primary-hover)}
.auc-iconbtn--inverse{color:var(--text-on-dark)}
.auc-iconbtn--inverse:hover{background:var(--white-a12)}
/* ---------- Icon ---------- */
.auc-icon{display:inline-flex;flex:none;align-items:center;justify-content:center;color:inherit}
.auc-icon svg{width:100%;height:100%;display:block}
/* fallback: if the inline SVG has not arrived (or a stale bundle still sets mask-image), paint the mask */
.auc-icon:not(:has(svg)){background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
/* ---------- Field / inputs ---------- */
.auc-field{display:flex;flex-direction:column;gap:6px}
.auc-field__label{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-strong)}
.auc-field__hint{font-size:var(--text-xs);color:var(--text-muted)}
.auc-field__error{font-size:var(--text-xs);color:var(--status-danger-fg);font-weight:var(--weight-medium)}
.auc-field__req{color:var(--action-accent);margin-left:2px}
.auc-input,.auc-select{font-family:var(--font-sans);font-size:var(--text-base);color:var(--text-strong);background:var(--surface-card);border:var(--border-hairline) solid var(--border-strong);border-radius:var(--radius-md);padding:11px 14px;width:100%;transition:var(--transition-control)}
.auc-input::placeholder{color:var(--text-subtle)}
.auc-input:hover,.auc-select:hover{border-color:var(--blue-500)}
.auc-input:focus,.auc-select:focus{outline:none;border-color:var(--border-accent);box-shadow:var(--focus-ring)}
.auc-input--invalid,.auc-select--invalid{border-color:var(--status-danger-fg)}
.auc-input[disabled],.auc-select[disabled]{background:var(--surface-sunken);color:var(--text-subtle);cursor:not-allowed}
textarea.auc-input{min-height:120px;resize:vertical;line-height:var(--leading-normal)}
.auc-select{appearance:none;padding-right:38px;background-image:linear-gradient(45deg,transparent 49%,var(--ink-600) 50%),linear-gradient(-45deg,transparent 49%,var(--ink-600) 50%);background-size:7px 7px,7px 7px;background-position:calc(100% - 20px) 20px,calc(100% - 14px) 20px;background-repeat:no-repeat}
/* ---------- Checkbox / Radio / Switch ---------- */
.auc-choice{display:inline-flex;align-items:flex-start;gap:10px;font-size:var(--text-base);color:var(--text-body);cursor:pointer}
.auc-choice input{position:absolute;opacity:0;width:0;height:0}
.auc-choice__box{width:20px;height:20px;flex:none;margin-top:2px;border:var(--border-thick) solid var(--border-strong);border-radius:var(--radius-xs);background:var(--surface-card);display:grid;place-items:center;transition:var(--transition-control)}
.auc-choice__box--round{border-radius:var(--radius-pill)}
.auc-choice:hover .auc-choice__box{border-color:var(--blue-500)}
.auc-choice input:focus-visible+.auc-choice__box{box-shadow:var(--focus-ring)}
.auc-choice input:checked+.auc-choice__box{background:var(--action-primary);border-color:var(--action-primary)}
.auc-choice__mark{width:11px;height:11px;color:#fff;opacity:0;transition:opacity var(--dur-fast) var(--ease-out)}
.auc-choice input:checked+.auc-choice__box .auc-choice__mark{opacity:1}
.auc-choice__dot{width:8px;height:8px;border-radius:var(--radius-pill);background:#fff;transform:scale(0);transition:transform var(--dur-fast) var(--ease-out)}
.auc-choice input:checked+.auc-choice__box .auc-choice__dot{transform:scale(1)}
.auc-choice--disabled{color:var(--text-subtle);cursor:not-allowed}
.auc-choice--disabled .auc-choice__box{background:var(--surface-sunken);border-color:var(--border-default)}
.auc-switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:var(--text-base);color:var(--text-body)}
.auc-switch input{position:absolute;opacity:0;width:0;height:0}
.auc-switch__track{width:44px;height:26px;flex:none;border-radius:var(--radius-pill);background:var(--ink-300);padding:3px;transition:background-color var(--dur-base) var(--ease-out)}
.auc-switch__thumb{width:20px;height:20px;border-radius:var(--radius-pill);background:#fff;box-shadow:var(--shadow-xs);transition:transform var(--dur-base) var(--ease-out)}
.auc-switch input:checked+.auc-switch__track{background:var(--action-accent)}
.auc-switch input:checked+.auc-switch__track .auc-switch__thumb{transform:translateX(18px)}
.auc-switch input:focus-visible+.auc-switch__track{box-shadow:var(--focus-ring)}
.auc-switch--disabled{opacity:.55;cursor:not-allowed}
/* ---------- Card ---------- */
.auc-card{background:var(--surface-card);border:var(--border-hairline) solid var(--border-default);border-radius:var(--radius-md);box-shadow:none;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out)}
.auc-card--flat{box-shadow:none}
.auc-card--raised{box-shadow:var(--shadow-md)}
.auc-card--inverse{background:var(--surface-inverse);border-color:var(--border-inverse);color:var(--text-on-dark-muted)}
.auc-card--interactive{cursor:pointer}
.auc-card--interactive:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--blue-500)}
.auc-card__body{padding:var(--space-7);display:flex;flex-direction:column;gap:var(--space-4)}
.auc-card__media{background:var(--surface-sunken);aspect-ratio:16/10}
.auc-card__accent{height:var(--border-rule);background:var(--action-accent)}
/* ---------- Badge / Tag ---------- */
.auc-badge{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-2xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase;padding:4px 9px;border-radius:var(--radius-xs)}
.auc-badge--neutral{background:var(--surface-sunken);color:var(--text-body)}
.auc-badge--info{background:var(--status-info-bg);color:var(--status-info-fg)}
.auc-badge--success{background:var(--status-success-bg);color:var(--status-success-fg)}
.auc-badge--warning{background:var(--status-warning-bg);color:var(--yellow-600)}
.auc-badge--danger{background:var(--status-danger-bg);color:var(--status-danger-fg)}
.auc-badge--accent{background:var(--orange-100);color:var(--orange-700)}
.auc-tag{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-brand);background:var(--surface-accent-soft);border:var(--border-hairline) solid var(--blue-100);border-radius:var(--radius-xs);padding:5px 12px;transition:var(--transition-control)}
.auc-tag--selectable{cursor:pointer}
.auc-tag--selectable:hover{background:var(--blue-100)}
.auc-tag--selected{background:var(--action-primary);border-color:var(--action-primary);color:var(--text-on-accent)}
.auc-tag__remove{display:grid;place-items:center;width:16px;height:16px;border:none;background:transparent;color:inherit;cursor:pointer;padding:0;opacity:.7}
.auc-tag__remove:hover{opacity:1}
/* ---------- Tabs ---------- */
.auc-tabs{display:flex;gap:var(--space-7);border-bottom:var(--border-hairline) solid var(--border-default)}
.auc-tabs__tab{position:relative;font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--weight-semibold);color:var(--text-muted);background:none;border:none;padding:0 0 12px;cursor:pointer;transition:color var(--dur-fast) var(--ease-out)}
.auc-tabs__tab:hover{color:var(--text-strong)}
.auc-tabs__tab[aria-selected="true"]{color:var(--text-brand)}
.auc-tabs__tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:var(--border-rule);background:var(--action-accent);border-radius:var(--radius-pill)}
.auc-tabs__tab:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-xs)}
.auc-tabs--pill{border:none;gap:var(--space-2);background:var(--surface-sunken);padding:4px;border-radius:var(--radius-sm)}
.auc-tabs--pill .auc-tabs__tab{padding:8px 18px;border-radius:var(--radius-xs);font-size:var(--text-sm)}
.auc-tabs--pill .auc-tabs__tab[aria-selected="true"]{background:var(--surface-card);color:var(--text-brand);box-shadow:var(--shadow-xs)}
.auc-tabs--pill .auc-tabs__tab[aria-selected="true"]::after{display:none}
/* ---------- Dialog ---------- */
.auc-dialog__scrim{position:fixed;inset:0;background:rgba(14,33,69,.55);display:grid;place-items:center;padding:var(--space-7);z-index:60;animation:auc-fade var(--dur-base) var(--ease-out)}
.auc-dialog{background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:520px;overflow:hidden;animation:auc-rise var(--dur-slow) var(--ease-entrance)}
.auc-dialog__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-5);padding:var(--space-7) var(--space-7) 0}
.auc-dialog__title{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--text-strong);letter-spacing:var(--tracking-tight)}
.auc-dialog__body{padding:var(--space-4) var(--space-7);color:var(--text-body)}
.auc-dialog__foot{display:flex;justify-content:flex-end;gap:var(--space-4);padding:var(--space-5) var(--space-7) var(--space-7)}
@keyframes auc-fade{from{opacity:0}to{opacity:1}}
@keyframes auc-rise{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
/* ---------- Toast ---------- */
.auc-toast{display:flex;align-items:flex-start;gap:var(--space-4);background:var(--surface-card);border:var(--border-hairline) solid var(--border-default);border-left:var(--space-2) solid var(--status-info-fg);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:var(--space-5);min-width:320px;max-width:420px;animation:auc-rise var(--dur-slow) var(--ease-entrance)}
.auc-toast--success{border-left-color:var(--status-success-fg)}
.auc-toast--warning{border-left-color:var(--yellow-500)}
.auc-toast--danger{border-left-color:var(--status-danger-fg)}
.auc-toast__title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-strong)}
.auc-toast__msg{font-size:var(--text-sm);color:var(--text-muted)}
/* ---------- Tooltip ---------- */
.auc-tooltip{position:relative;display:inline-flex}
.auc-tooltip__bubble{position:absolute;z-index:40;background:var(--ink-900);color:#fff;font-size:var(--text-xs);font-weight:var(--weight-medium);padding:7px 10px;border-radius:var(--radius-sm);white-space:nowrap;box-shadow:var(--shadow-md);pointer-events:none;animation:auc-fade var(--dur-fast) var(--ease-out)}
.auc-tooltip__bubble--top{bottom:calc(100% + 8px);left:50%;transform:translateX(-50%)}
.auc-tooltip__bubble--bottom{top:calc(100% + 8px);left:50%;transform:translateX(-50%)}
.auc-tooltip__bubble--right{left:calc(100% + 8px);top:50%;transform:translateY(-50%)}