/* YDS components copied unchanged from the Yalo Design System .jsx files (YaloStudio DS export). Do not edit: override in ../app.css. */
/* --- actions/Button --- */

.yds-btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-ui);font-size:14px;font-weight:350;line-height:1.4em;height:36px;padding:10px 16px;border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;white-space:nowrap;box-shadow:none;background:transparent;color:var(--text-primary);transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease;box-sizing:border-box}
.yds-btn .yds-btn-label{display:block}
.yds-btn .yds-btn-label::first-letter{text-transform:uppercase}
.yds-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--c-lighter)}
.yds-btn .yds-btn-ic{font-size:12px;display:inline-flex}
.yds-btn .yds-btn-ic:first-child{margin-right:8px}
.yds-btn .yds-btn-ic:last-child{margin-left:8px}
.yds-btn--strong{background:var(--c);color:var(--c-contrast)}
.yds-btn--strong:hover:not(:disabled){background:var(--c-dark)}
.yds-btn--strong:active:not(:disabled){background:var(--c-darker)}
.yds-btn--outlined{background:var(--surface-paper);border-color:var(--c-light);color:var(--c)}
.yds-btn--outlined:hover:not(:disabled){border-color:var(--c);background:var(--c-lighter)}
.yds-btn--outlined:active:not(:disabled){background:var(--c-lighter)}
.yds-btn--contained{background:var(--c-lighter);color:var(--c-dark)}
.yds-btn--contained:hover:not(:disabled){background:var(--c-light);color:var(--c-darker)}
.yds-btn--text{color:var(--c)}
.yds-btn--text:hover:not(:disabled){background:var(--c-lighter)}
.yds-c-neutral.yds-btn--outlined{color:var(--color-neutral-contrast);border-color:var(--color-neutral-darker)}
.yds-c-neutral.yds-btn--outlined:hover:not(:disabled){border-color:var(--color-neutral-darker)}
.yds-c-neutral.yds-btn--text{color:var(--color-neutral-contrast)}
.yds-c-neutral.yds-btn--contained{background:var(--color-neutral);color:var(--color-neutral-contrast)}
.yds-btn--subtle{height:28px;padding:4px 12px;font-size:12px;font-weight:450}
.yds-btn--subtle .yds-btn-ic{font-size:10px}
.yds-btn:disabled{cursor:default}
.yds-btn--outlined:disabled{background:var(--neutral-0);color:var(--neutral-40);border-color:var(--neutral-30)}
.yds-btn--strong:disabled,.yds-btn--contained:disabled{color:var(--neutral-40);background:var(--neutral-20)}
.yds-btn--text:disabled{color:var(--neutral-40)}

/* --- layout/Header --- */

.yds-header{display:flex;flex-wrap:wrap;align-items:center;gap:var(--layout-gap);width:100%;padding-bottom:12px;border-bottom:1px solid var(--neutral-30);font-family:var(--font-ui);box-sizing:border-box}
.yds-header--no-divider{border-bottom:none}
.yds-header-left{display:flex;align-items:center;gap:8px;margin-right:auto}
.yds-header-right{display:flex;align-items:center;gap:8px}
.yds-header-bottom{flex-basis:100%;display:flex;align-items:center;gap:8px}

/* --- layout/Main --- */

.yds-main{min-height:100vh;background:var(--surface-default);font-family:var(--font-ui);color:var(--text-primary);display:flex;flex-direction:column;align-items:center;box-sizing:border-box}
.yds-main-inner{width:100%;max-width:var(--layout-max-width);padding:var(--layout-padding);display:flex;flex-direction:column;gap:var(--layout-gap);box-sizing:border-box}
.yds-main--full .yds-main-inner{max-width:none}

/* --- forms/TextField --- */

.yds-field{display:flex;flex-direction:column;font-family:var(--font-ui);min-width:0}
.yds-field-label{font-size:12px;font-weight:450;line-height:1.4em;color:var(--text-primary);padding-bottom:2px}
.yds-field.is-disabled .yds-field-label{color:var(--neutral-40)}
.yds-field-box{display:flex;align-items:center;background:var(--surface-paper);border:1px solid var(--neutral-20);border-radius:var(--radius-md);transition:border-color .2s ease;box-sizing:border-box}
.yds-field-box:hover{border-color:var(--neutral-40)}
.yds-field-box:focus-within{border-color:var(--color-primary)}
.yds-field.is-error .yds-field-box{border-color:var(--color-error)}
.yds-field.is-correct .yds-field-box{border-color:var(--color-success)}
.yds-field.is-disabled .yds-field-box{border-color:transparent;background:var(--neutral-10)}
.yds-field-input{flex:1;min-width:0;border:none;outline:none;background:transparent;font-family:var(--font-ui);font-size:14px;font-weight:350;line-height:1.4em;color:var(--text-primary);height:34px;padding:10px;box-sizing:border-box}
textarea.yds-field-input{height:auto;min-height:68px;resize:vertical}
.yds-field-input::placeholder{color:var(--neutral-50);opacity:1}
.yds-field.is-disabled .yds-field-input{color:var(--neutral-50)}
.yds-field-adorn{font-size:12px;color:var(--neutral-60);display:inline-flex;padding:0 0 0 12px}
.yds-field-adorn--end{padding:0 12px 0 0}
.yds-field.is-error .yds-field-adorn--end{color:var(--color-error)}
.yds-field.is-correct .yds-field-adorn--end{color:var(--color-success)}
.yds-field-helper{text-align:right;font-size:11px;font-weight:450;line-height:16px;color:var(--neutral-50);padding-top:2px}
.yds-field.is-error .yds-field-helper{color:var(--color-error)}
.yds-field.is-correct .yds-field-helper{color:var(--color-success)}
select.yds-field-input{appearance:none;-webkit-appearance:none;padding-right:32px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' width='12' height='12'%3E%3Cpath fill='%236E6963' d='M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}

/* --- forms/Switch --- */

.yds-switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-family:var(--font-ui);font-size:14px;font-weight:350;color:var(--text-primary);user-select:none}
.yds-switch input{position:absolute;opacity:0;width:0;height:0}
.yds-switch-track{width:32px;height:20px;border-radius:var(--radius-pill);background:var(--neutral-30);position:relative;transition:background-color .2s ease,box-shadow .3s ease-in-out;flex:none}
.yds-switch-track::after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .2s ease}
.yds-switch.is-checked .yds-switch-track{background:var(--color-primary)}
.yds-switch.is-checked .yds-switch-track::after{transform:translateX(12px)}
.yds-switch:hover .yds-switch-track,.yds-switch input:focus-visible+.yds-switch-track{box-shadow:0 0 0 4px var(--color-primary-lighter)}
.yds-switch.is-disabled{cursor:default;color:var(--neutral-40)}
.yds-switch.is-disabled .yds-switch-track{opacity:.5;box-shadow:none}

/* --- data/Tag --- */

.yds-tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:var(--radius-md);border:1px solid transparent;font-family:var(--font-ui);font-size:12px;font-weight:450;line-height:1;color:var(--tag-fg,#252119);background:var(--tag-bg);border-color:var(--tag-border);box-sizing:border-box;white-space:nowrap}
.yds-tag--outlined{background:transparent}
.yds-tag--rectangular{border-radius:var(--radius-xs)}
.yds-tag.is-clickable{cursor:pointer;transition:background-color .2s ease}
.yds-tag.is-clickable:hover{background:var(--tag-hover)}
.yds-tag--outlined.is-clickable:hover{background:var(--tag-bg-filled)}
.yds-tag-delete{border:none;background:none;padding:0;cursor:pointer;color:#6E6963;font-size:11px;display:inline-flex}
.yds-tag-delete:hover{color:#252119}
.yds-tag i.yds-tag-icon{font-size:11px}

/* --- table/DataGrid --- */

.yds-datagrid{border:1px solid var(--border-default);border-radius:var(--radius-lg);overflow:hidden;font-family:var(--font-ui);background:var(--surface-paper)}
.yds-datagrid table{width:100%;border-collapse:collapse}
.yds-datagrid th{text-align:left;font-size:12px;font-weight:600;color:var(--text-secondary);padding:0 16px;height:40px;border-bottom:1px solid var(--border-default);white-space:nowrap}
.yds-datagrid td{font-size:14px;font-weight:350;color:var(--text-primary);padding:0 16px;height:44px;border-bottom:1px solid var(--neutral-20)}
.yds-datagrid tbody tr:last-child td{border-bottom:none}
.yds-datagrid tbody tr{transition:background-color .15s ease}
.yds-datagrid tbody tr:hover{background:var(--neutral-10)}
.yds-datagrid tbody tr.is-selected{background:var(--color-primary-lighter)}
.yds-datagrid .yds-datagrid-check{width:36px;padding-right:0}
.yds-datagrid-actions{display:flex;gap:4px;justify-content:flex-end;opacity:0;transition:opacity .15s ease}
.yds-datagrid tbody tr:hover .yds-datagrid-actions{opacity:1}

/* --- metrics/MetricCard --- */

.yds-metric{background:var(--surface-paper);border:1px solid var(--border-default);border-radius:var(--radius-md);padding:12px;font-family:var(--font-ui);cursor:default;box-sizing:border-box;display:flex;flex-direction:column;gap:2px}
.yds-metric--elevation{border:none;box-shadow:var(--shadow-2)}
.yds-metric-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.yds-metric-title{font-size:14px;font-weight:350;line-height:16px;color:var(--text-primary)}
.yds-metric--top .yds-metric-title{font-size:16px;font-weight:450}
.yds-metric-value{font-size:20px;font-weight:700;line-height:1.4em;color:var(--text-primary)}
.yds-metric--top .yds-metric-value{font-size:24px}
.yds-metric-trend{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600}
.yds-metric-trend--up{color:var(--color-success)}
.yds-metric-trend--down{color:var(--color-error)}
.yds-metric-trend--flat{color:var(--text-secondary)}
.yds-metric-desc{font-size:12px;font-weight:450;color:var(--text-secondary)}
.yds-metric-alert{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:450;color:var(--color-warning);margin-top:4px}

/* --- feedback/Alert --- */

.yds-alert{display:flex;gap:12px;padding:12px;border-radius:var(--radius-md);box-shadow:var(--shadow-2);font-family:var(--font-ui);font-size:12px;font-weight:450;line-height:1.4em;color:var(--neutral-70);max-width:460px;box-sizing:border-box;align-items:flex-start}
.yds-alert--secondary{box-shadow:none;padding-left:16px}
.yds-alert-icon{font-size:18px;line-height:1;padding-top:1px}
.yds-alert-message{display:flex;flex-direction:column;justify-content:center;gap:2px;flex:1}
.yds-alert-title{font-size:14px;font-weight:600;line-height:1.4em}
.yds-alert-close{border:none;background:none;cursor:pointer;padding:0;width:20px;height:20px;font-size:14px;color:inherit;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-sm)}
.yds-alert-close:hover{background:rgba(0,0,0,0.06)}
.yds-alert--info{background:var(--color-info-lighter)}
.yds-alert--info .yds-alert-icon,.yds-alert--info .yds-alert-title,.yds-alert--info .yds-alert-close{color:var(--color-info-darker)}
.yds-alert--success{background:var(--color-success-lighter)}
.yds-alert--success .yds-alert-icon{color:var(--color-success)}
.yds-alert--success .yds-alert-title,.yds-alert--success .yds-alert-close{color:var(--color-success-darker)}
.yds-alert--warning{background:var(--color-warning-lighter)}
.yds-alert--warning .yds-alert-icon{color:var(--color-warning)}
.yds-alert--warning .yds-alert-title,.yds-alert--warning .yds-alert-close{color:var(--color-warning-dark)}
.yds-alert--error{background:var(--color-error-lighter)}
.yds-alert--error .yds-alert-icon{color:var(--color-error-dark)}
.yds-alert--error .yds-alert-title,.yds-alert--error .yds-alert-close{color:var(--color-error-darker)}
.yds-alert--neutral{background:var(--neutral-10)}
.yds-alert--neutral .yds-alert-icon,.yds-alert--neutral .yds-alert-title,.yds-alert--neutral .yds-alert-close{color:var(--neutral-60)}

/* --- feedback/Skeleton --- */

.yds-skeleton{position:relative;overflow:hidden;background:var(--neutral-20);display:block}
.yds-skeleton::after{content:'';position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,0.5),transparent);animation:yds-skeleton-wave 1.6s linear infinite}
@keyframes yds-skeleton-wave{0%{transform:translateX(-100%)}60%{transform:translateX(100%)}100%{transform:translateX(100%)}}
.yds-skeleton--text{height:14px;border-radius:var(--radius-sm)}
.yds-skeleton--circular{border-radius:50%}
.yds-skeleton--rectangular{border-radius:0}
.yds-skeleton--rounded{border-radius:var(--radius-md)}

/* --- overlays/Drawer --- */

.yds-drawer-backdrop{position:fixed;inset:0;background:rgba(11,9,8,0.25);z-index:90}
.yds-drawer{position:fixed;top:0;right:0;bottom:0;width:480px;max-width:90vw;background:var(--surface-paper);box-shadow:var(--shadow-16);z-index:95;display:flex;flex-direction:column;font-family:var(--font-ui)}
.yds-drawer--small{width:360px}
.yds-drawer-title{display:flex;align-items:center;gap:8px;padding:16px 24px;font-size:18px;font-weight:600;color:var(--text-primary);border-bottom:1px solid var(--neutral-20)}
.yds-drawer-close{margin-left:auto;border:none;background:none;cursor:pointer;width:28px;height:28px;border-radius:var(--radius-sm);color:var(--neutral-60);font-size:14px}
.yds-drawer-close:hover{background:var(--neutral-10)}
.yds-drawer-content{padding:16px 24px;overflow:auto;flex:1;font-size:14px;font-weight:350;line-height:1.4em;color:var(--text-primary)}

/* --- charts/ChartBar (legenda) --- */
.yds-chart-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;font-weight:450;color:var(--text-secondary)}
.yds-chart-legend span{display:inline-flex;align-items:center;gap:4px}
.yds-chart-legend i{width:8px;height:8px;border-radius:2px;display:inline-block}