:root {
  --oi-space-1: .25rem;
  --oi-space-2: .5rem;
  --oi-space-3: 1rem;
  --oi-space-4: 1.5rem;
  --oi-space-5: 2rem;
  --oi-radius-fallback: .5rem;
  --oi-shadow-fallback: 0 .25rem 1rem rgba(0,0,0,.08);
}
.oi-card{background:var(--oi-surface,#fff);border:1px solid var(--oi-border,#dcdcde);border-radius:var(--oi-radius,var(--oi-radius-fallback));box-shadow:var(--oi-shadow,var(--oi-shadow-fallback));padding:var(--oi-space-4)}
.oi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--oi-space-3)}
.oi-status{display:inline-flex;align-items:center;gap:.35rem;font-size:.875rem;font-weight:600}
.oi-status::before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:currentColor}
.oi-status--ok{color:var(--oi-success,#008a20)}.oi-status--warning{color:var(--oi-warning,#996800)}.oi-status--error{color:var(--oi-danger,#b32d2e)}.oi-status--unknown{color:#646970}

/* Onda Admin UI Kit 0.3 */
.oi-page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--oi-space-4);margin:24px 0}
.oi-page-header__content{min-width:0}
.oi-page-header__eyebrow{margin:0;text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:700;color:var(--oi-primary,#2271b1)}
.oi-page-header__title-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:3px}
.oi-page-header__title{margin:0;padding:0;font-size:28px;line-height:1.25}
.oi-page-header__description{max-width:720px;margin:8px 0 0;color:#50575e;font-size:14px}
.oi-page-header__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.oi-badge{display:inline-flex;align-items:center;min-height:24px;padding:2px 9px;border:1px solid transparent;border-radius:999px;font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap}
.oi-badge--success{color:#006b1b;background:#edfaef;border-color:#b8e6bf}
.oi-badge--warning{color:#7a5200;background:#fff8df;border-color:#ecd889}
.oi-badge--danger{color:#9b1c1c;background:#fff0f0;border-color:#efb7b7}
.oi-badge--info{color:#135e96;background:#eef6fc;border-color:#b8d7ee}
.oi-badge--neutral{color:#50575e;background:#f6f7f7;border-color:#dcdcde}
.oi-card{display:flex;flex-direction:column;min-height:180px}
.oi-card__header{display:flex;justify-content:space-between;align-items:center;gap:12px}
.oi-card__icon{width:30px;height:30px;font-size:30px;color:var(--oi-primary,#2271b1)}
.oi-card__title{margin:16px 0 6px;font-size:18px;line-height:1.35}
.oi-card__content{margin:0;color:#50575e;line-height:1.55}
.oi-card__footer{margin:auto 0 0;padding-top:16px;color:#646970;font-size:12px}
.oi-card__actions{margin:14px 0 0}
@media (max-width:782px){.oi-page-header{flex-direction:column}.oi-page-header__actions{width:100%}}

.oi-notice{display:flex;align-items:flex-start;gap:12px;margin:16px 0;padding:13px 15px;background:#fff;border:1px solid #dcdcde;border-left-width:4px;border-radius:var(--oi-radius,var(--oi-radius-fallback))}
.oi-notice__marker{flex:0 0 auto;width:9px;height:9px;margin-top:5px;border-radius:50%;background:currentColor}
.oi-notice__content{min-width:0}
.oi-notice__title,.oi-notice__message{margin:0}
.oi-notice__title{margin-bottom:3px;font-weight:700}
.oi-notice--success{color:#006b1b;border-left-color:#008a20;background:#f4fbf5}
.oi-notice--warning{color:#7a5200;border-left-color:#dba617;background:#fffbeb}
.oi-notice--danger{color:#9b1c1c;border-left-color:#b32d2e;background:#fff5f5}
.oi-notice--info{color:#135e96;border-left-color:#2271b1;background:#f4f9fd}
.oi-notice--neutral{color:#50575e;border-left-color:#787c82;background:#f8f9f9}
