/**
 * SYNAI Component System 0.9.0
 * Reusable UI primitives and accessible interaction states.
 */
:root {
  --synai-radius-xs: .375rem;
  --synai-radius-sm: .625rem;
  --synai-radius-md: 1rem;
  --synai-radius-lg: 1.5rem;
  --synai-shadow-sm: 0 4px 14px rgba(0,18,54,.08);
  --synai-shadow-md: 0 12px 32px rgba(0,18,54,.12);
  --synai-shadow-lg: 0 24px 64px rgba(0,18,54,.18);
  --synai-transition-fast: 160ms ease;
  --synai-transition-base: 240ms cubic-bezier(.2,.7,.2,1);
  --synai-success: #198754;
  --synai-warning: #b36b00;
  --synai-danger: #c62828;
  --synai-info: #0b6bcb;
}

/* Buttons */
.synai-button,.button,.wp-block-button__link {
  align-items:center;border:1px solid transparent;border-radius:var(--synai-radius-sm);cursor:pointer;display:inline-flex;font:600 .875rem/1 var(--font-body,Inter,sans-serif);gap:.625rem;justify-content:center;min-height:44px;padding:.875rem 1.25rem;text-decoration:none;transition:transform var(--synai-transition-fast),background-color var(--synai-transition-fast),border-color var(--synai-transition-fast),box-shadow var(--synai-transition-fast),color var(--synai-transition-fast);
}
.synai-button:hover,.button:hover,.wp-block-button__link:hover{transform:translateY(-1px)}
.synai-button:focus-visible,.button:focus-visible,.wp-block-button__link:focus-visible{outline:3px solid rgba(0,178,227,.35);outline-offset:3px}
.synai-button--primary,.button--primary{background:var(--color-primary,#1656d8);color:#fff;box-shadow:0 8px 18px rgba(22,86,216,.22)}
.synai-button--primary:hover,.button--primary:hover{background:#0e46b8;color:#fff}
.synai-button--secondary,.button--secondary,.button--light{background:#fff;border-color:#b9c7dc;color:#071a3d}
.synai-button--ghost{background:transparent;color:var(--color-primary,#1656d8)}
.synai-button--sm{min-height:36px;padding:.625rem .875rem;font-size:.8125rem}
.synai-button--lg{min-height:52px;padding:1rem 1.5rem;font-size:1rem}
.synai-button[disabled],.button[disabled],.is-disabled{cursor:not-allowed;opacity:.45;pointer-events:none;transform:none}

/* Cards */
.synai-card{background:#fff;border:1px solid #dce4ef;border-radius:var(--synai-radius-md);box-shadow:var(--synai-shadow-sm);display:flex;flex-direction:column;min-width:0;overflow:hidden;transition:border-color var(--synai-transition-base),box-shadow var(--synai-transition-base),transform var(--synai-transition-base)}
.synai-card:hover{border-color:#a9c8f6;box-shadow:var(--synai-shadow-md);transform:translateY(-4px)}
.synai-card__media{aspect-ratio:16/9;background:#eaf1fb;overflow:hidden}
.synai-card__media img{height:100%;object-fit:cover;width:100%}
.synai-card__body{display:grid;gap:var(--space-16,1rem);padding:var(--space-24,1.5rem)}
.synai-card__eyebrow{color:var(--color-primary,#1656d8);font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.synai-card__title{font-size:1.25rem;margin:0}
.synai-card__text{color:#52627a;margin:0}
.synai-card__link{align-self:flex-start;color:var(--color-primary,#1656d8);font-weight:650;text-decoration:none}
.synai-kpi-card{align-items:flex-start;padding:var(--space-24,1.5rem)}
.synai-kpi-card__value{font-family:var(--font-heading,"Space Grotesk",sans-serif);font-size:clamp(2rem,4vw,3.5rem);font-weight:700;line-height:1}

/* Badges and labels */
.synai-badge{align-items:center;background:#edf3ff;border:1px solid #cbdcff;border-radius:999px;color:#164fae;display:inline-flex;font-size:.75rem;font-weight:650;gap:.35rem;line-height:1;padding:.4rem .65rem;white-space:nowrap}
.synai-badge--success{background:#e9f7ef;border-color:#b7e1c7;color:#176a3a}.synai-badge--warning{background:#fff5e6;border-color:#f3d3a4;color:#8d5300}.synai-badge--danger{background:#fff0f0;border-color:#efc1c1;color:#a92121}.synai-badge--neutral{background:#f2f4f7;border-color:#dde2e8;color:#465466}

/* Tabs */
.synai-tabs{display:grid;gap:var(--space-24,1.5rem)}
.synai-tabs__list{border-bottom:1px solid #dce4ef;display:flex;gap:.25rem;overflow-x:auto}
.synai-tabs__tab{background:transparent;border:0;border-bottom:3px solid transparent;color:#52627a;cursor:pointer;font:600 .875rem/1.2 var(--font-body,Inter,sans-serif);padding:.875rem 1rem;white-space:nowrap}
.synai-tabs__tab[aria-selected="true"]{border-bottom-color:var(--color-primary,#1656d8);color:#071a3d}
.synai-tabs__tab:focus-visible{outline:3px solid rgba(0,178,227,.35);outline-offset:-2px}
.synai-tabs__panel[hidden]{display:none}

/* Accordion */
.synai-accordion{border:1px solid #dce4ef;border-radius:var(--synai-radius-md);overflow:hidden}
.synai-accordion__item+ .synai-accordion__item{border-top:1px solid #dce4ef}
.synai-accordion__trigger{align-items:center;background:#fff;border:0;color:#071a3d;cursor:pointer;display:flex;font:650 1rem/1.4 var(--font-body,Inter,sans-serif);justify-content:space-between;padding:1.1rem 1.25rem;text-align:left;width:100%}
.synai-accordion__trigger::after{content:"+";font-size:1.35rem}.synai-accordion__trigger[aria-expanded="true"]::after{content:"−"}
.synai-accordion__trigger:focus-visible{outline:3px solid rgba(0,178,227,.35);outline-offset:-3px}
.synai-accordion__panel{background:#f8fbff;padding:0 1.25rem 1.25rem}.synai-accordion__panel[hidden]{display:none}

/* Alerts */
.synai-alert{align-items:flex-start;border:1px solid;border-radius:var(--synai-radius-sm);display:flex;gap:.75rem;padding:1rem 1.125rem}
.synai-alert--success{background:#eef9f2;border-color:#b8dfc5;color:#175e34}.synai-alert--info{background:#eff7ff;border-color:#b8d6f5;color:#12558f}.synai-alert--warning{background:#fff8e8;border-color:#ecd29a;color:#7a5000}.synai-alert--danger{background:#fff1f1;border-color:#ecc0c0;color:#9a2020}

/* Forms */
.synai-field{display:grid;gap:.5rem}.synai-field label{font-size:.875rem;font-weight:650;color:#142441}.synai-field input,.synai-field select,.synai-field textarea{background:#fff;border:1px solid #bac7d9;border-radius:var(--synai-radius-sm);color:#071a3d;font:400 1rem/1.4 var(--font-body,Inter,sans-serif);min-height:46px;padding:.75rem .875rem;width:100%}.synai-field textarea{min-height:140px;resize:vertical}.synai-field input:focus,.synai-field select:focus,.synai-field textarea:focus{border-color:var(--color-primary,#1656d8);box-shadow:0 0 0 3px rgba(22,86,216,.13);outline:0}.synai-field--error input,.synai-field--error select,.synai-field--error textarea{border-color:var(--synai-danger)}.synai-field__help{color:#66758a;font-size:.8125rem}.synai-field__error{color:var(--synai-danger);font-size:.8125rem}

/* Modal */
.synai-modal[hidden]{display:none}.synai-modal{inset:0;position:fixed;z-index:var(--z-modal,1000)}.synai-modal__backdrop{background:rgba(2,13,35,.68);inset:0;position:absolute}.synai-modal__dialog{background:#fff;border-radius:var(--synai-radius-md);box-shadow:var(--synai-shadow-lg);left:50%;max-height:calc(100vh - 2rem);max-width:min(36rem,calc(100vw - 2rem));overflow:auto;padding:2rem;position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}.synai-modal__close{align-items:center;background:transparent;border:0;border-radius:50%;cursor:pointer;display:flex;font-size:1.5rem;height:44px;justify-content:center;position:absolute;right:.75rem;top:.75rem;width:44px}

/* Tooltip */
[data-synai-tooltip]{position:relative}.synai-tooltip{background:#071a3d;border-radius:.375rem;color:#fff;font-size:.75rem;left:50%;max-width:14rem;padding:.5rem .65rem;pointer-events:none;position:absolute;top:calc(100% + .5rem);transform:translateX(-50%);z-index:var(--z-tooltip,1100)}

/* Progress and steps */
.synai-progress{background:#e6edf7;border-radius:999px;height:.5rem;overflow:hidden}.synai-progress__bar{background:linear-gradient(90deg,#1656d8,#00b2e3);height:100%;transition:width var(--synai-transition-base)}
.synai-steps{counter-reset:synai-step;display:flex;gap:1rem;list-style:none;margin:0;padding:0}.synai-steps li{align-items:center;color:#66758a;display:flex;flex:1;gap:.65rem}.synai-steps li::before{align-items:center;background:#e8edf5;border-radius:50%;content:counter(synai-step);counter-increment:synai-step;display:flex;flex:0 0 2rem;height:2rem;justify-content:center}.synai-steps li.is-active{color:#071a3d;font-weight:650}.synai-steps li.is-active::before{background:var(--color-primary,#1656d8);color:#fff}

/* Responsive component behavior */
@media (max-width:767px){.synai-button{width:100%}.synai-tabs__list{margin-inline:-1rem;padding-inline:1rem}.synai-modal__dialog{border-radius:var(--synai-radius-md) var(--synai-radius-md) 0 0;bottom:0;left:0;max-height:88vh;max-width:none;top:auto;transform:none}.synai-steps{flex-direction:column}}
@media (prefers-reduced-motion:reduce){.synai-card,.synai-button,.button,.wp-block-button__link,.synai-progress__bar{transition:none!important}.synai-card:hover,.synai-button:hover,.button:hover{transform:none}}
