/* ===== SANKHYA ERP STYLE ===== */
:root {
    --snk-navy:      #003366;
    --snk-navy-dark: #002244;
    --snk-blue:      #0066CC;
    --snk-blue-lt:   #E8F0FB;
    --snk-green:     #2E7D32;
    --snk-green-lt:  #E8F5E9;
    --snk-red:       #C62828;
    --snk-red-lt:    #FFEBEE;
    --snk-orange:    #E65100;
    --snk-yellow:    #F57F17;
    --snk-bg:        #F0F2F5;
    --snk-surface:   #FFFFFF;
    --snk-border:    #C8CDD4;
    --snk-border-dk: #9EA6B0;
    --snk-text:      #222831;
    --snk-text-muted:#5A6270;
    --snk-header-h:  44px;
    --snk-toolbar-h: 40px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    background: var(--snk-bg);
    color: var(--snk-text);
    min-height: 100vh;
}

/* ===== HEADER ===== */
.snk-header {
    background: linear-gradient(180deg, #004080 0%, var(--snk-navy) 100%);
    height: var(--snk-header-h);
    display: flex;
    align-items: center;
    padding: 0 16px;
    gap: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.35);
    position: sticky;
    top: 0;
    z-index: 200;
}

.snk-header-logo {
    font-size: 15px;
    font-weight: bold;
    color: #FFFFFF;
    letter-spacing: 0.5px;
}

.snk-header-logo span {
    color: #7EC8FF;
}

.snk-header-sep {
    width: 1px;
    height: 22px;
    background: rgba(255,255,255,0.25);
}

.snk-header-title {
    color: #C8DCF0;
    font-size: 12px;
    font-weight: normal;
}

.snk-header-spacer { flex: 1; }

.snk-header-user {
    font-size: 12px;
    color: rgba(255,255,255,0.85);
    white-space: nowrap;
}

.snk-header-logout {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.25);
    color: #fff;
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 3px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s;
}
.snk-header-logout:hover { background: rgba(255,255,255,0.22); }

/* ===== TABS (Sankhya style) ===== */
.snk-tabs {
    display: flex;
    background: var(--snk-navy);
    border-bottom: 2px solid var(--snk-blue);
    padding: 0 8px;
    gap: 2px;
}

.snk-tab {
    padding: 7px 18px;
    color: #A8C4E0;
    background: transparent;
    border: none;
    border-top: 2px solid transparent;
    border-bottom: none;
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 0.2px;
    transition: background 0.15s, color 0.15s;
    margin-top: 2px;
}

.snk-tab:hover {
    background: rgba(255,255,255,0.08);
    color: #fff;
}

.snk-tab.active {
    background: var(--snk-bg);
    color: var(--snk-navy);
    border-top-color: #FF9800;
    border-radius: 3px 3px 0 0;
}

.snk-tab-content { display: none; }
.snk-tab-content.active { display: block; }

/* ===== PAGE LAYOUT ===== */
.snk-page {
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ===== TOOLBAR ===== */
.snk-toolbar {
    height: var(--snk-toolbar-h);
    background: linear-gradient(180deg, #E8EDF2 0%, #D4DAE2 100%);
    border: 1px solid var(--snk-border);
    border-radius: 3px;
    display: flex;
    align-items: center;
    padding: 0 6px;
    gap: 4px;
}

.snk-toolbar-sep {
    width: 1px;
    height: 22px;
    background: var(--snk-border-dk);
    margin: 0 3px;
}

.snk-toolbar-label {
    font-size: 11px;
    font-weight: bold;
    color: var(--snk-text-muted);
    padding: 0 6px;
}

/* ===== TOOLBAR BUTTONS ===== */
.snk-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border: 1px solid var(--snk-border-dk);
    border-radius: 3px;
    background: linear-gradient(180deg, #FAFBFC 0%, #E8ECF0 100%);
    color: var(--snk-text);
    font-family: inherit;
    font-size: 11px;
    font-weight: bold;
    cursor: pointer;
    white-space: nowrap;
    transition: none;
    height: 28px;
}

.snk-btn:hover:not(:disabled) {
    background: linear-gradient(180deg, #E0EAFF 0%, #C8D8F5 100%);
    border-color: var(--snk-blue);
    color: var(--snk-navy);
}

.snk-btn:active:not(:disabled) {
    background: linear-gradient(180deg, #C8D8F5 0%, #B0C8F0 100%);
}

.snk-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.snk-btn.snk-btn-primary {
    background: linear-gradient(180deg, #1E7EDC 0%, #0052A5 100%);
    border-color: #0044CC;
    color: #fff;
}

.snk-btn.snk-btn-primary:hover:not(:disabled) {
    background: linear-gradient(180deg, #3090EE 0%, #1166CC 100%);
}

.snk-btn.snk-btn-success {
    background: linear-gradient(180deg, #4CAF50 0%, #357A38 100%);
    border-color: #2E7D32;
    color: #fff;
}

.snk-btn.snk-btn-success:hover:not(:disabled) {
    background: linear-gradient(180deg, #5EC062 0%, #457A48 100%);
}

.snk-btn.snk-btn-danger {
    background: linear-gradient(180deg, #EF5350 0%, #B71C1C 100%);
    border-color: #C62828;
    color: #fff;
}

.snk-btn.snk-btn-danger:hover:not(:disabled) {
    background: linear-gradient(180deg, #F06060 0%, #C83030 100%);
}

.snk-btn.snk-btn-reset {
    background: linear-gradient(180deg, #FFE082 0%, #FFB300 100%);
    border-color: #F9A825;
    color: #5D4037;
}

/* ===== PANELS ===== */
.snk-panel {
    background: var(--snk-surface);
    border: 1px solid var(--snk-border);
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}

.snk-panel-header {
    background: linear-gradient(180deg, #E8EDF2 0%, #D8DFE8 100%);
    border-bottom: 1px solid var(--snk-border);
    padding: 5px 10px;
    font-size: 11px;
    font-weight: bold;
    color: var(--snk-navy);
    letter-spacing: 0.3px;
    border-radius: 3px 3px 0 0;
}

.snk-panel-body {
    padding: 10px 12px;
}

/* ===== FORM (Sankhya compact style) ===== */
.snk-form {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    align-items: flex-end;
}

.snk-field {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.snk-field.snk-field-sm  { min-width: 100px; flex: 0 0 120px; }
.snk-field.snk-field-md  { min-width: 180px; flex: 1 1 220px; }
.snk-field.snk-field-lg  { min-width: 260px; flex: 2 1 300px; }
.snk-field.snk-field-btn { flex: 0 0 auto; }

.snk-label {
    font-size: 11px;
    font-weight: bold;
    color: var(--snk-text-muted);
}

.snk-input, .snk-select {
    height: 26px;
    padding: 0 6px;
    border: 1px solid var(--snk-border-dk);
    border-radius: 2px;
    background: #fff;
    color: var(--snk-text);
    font-family: inherit;
    font-size: 12px;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    width: 100%;
}

.snk-input:focus, .snk-select:focus {
    border-color: var(--snk-blue);
    box-shadow: 0 0 0 2px rgba(0, 102, 204, 0.15);
}

.snk-input.snk-selected {
    border-color: #2E7D32;
    background: #F1F9F1;
    color: #1B5E20;
    font-weight: bold;
}

/* ===== AUTOCOMPLETE ===== */
.snk-autocomplete-wrapper { position: relative; }

.snk-autocomplete-dropdown {
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid var(--snk-blue);
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    z-index: 300;
    max-height: 200px;
    overflow-y: auto;
    border-radius: 0 0 3px 3px;
}

.snk-autocomplete-dropdown.hidden { display: none; }

.snk-autocomplete-item {
    padding: 5px 8px;
    cursor: pointer;
    font-size: 12px;
    color: var(--snk-text);
    border-bottom: 1px solid #EEF0F2;
}

.snk-autocomplete-item:last-child { border-bottom: none; }

.snk-autocomplete-item:hover,
.snk-autocomplete-item.active {
    background: var(--snk-blue-lt);
    color: var(--snk-navy);
}

.snk-autocomplete-loading,
.snk-autocomplete-empty {
    padding: 6px 8px;
    font-size: 11px;
    color: var(--snk-text-muted);
    font-style: italic;
}

/* ===== GRID / TABLE ===== */
.snk-grid-container {
    overflow-x: auto;
}

.snk-grid {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.snk-grid thead tr {
    background: linear-gradient(180deg, #D4DCE8 0%, #C0CBDA 100%);
}

.snk-grid th {
    padding: 5px 8px;
    text-align: left;
    border: 1px solid var(--snk-border);
    font-size: 11px;
    font-weight: bold;
    color: var(--snk-navy);
    white-space: nowrap;
}

.snk-grid td {
    padding: 4px 8px;
    border: 1px solid var(--snk-border);
    color: var(--snk-text);
    vertical-align: middle;
}

.snk-grid tbody tr:nth-child(even) {
    background: #F4F6F9;
}

.snk-grid tbody tr:hover {
    background: var(--snk-blue-lt);
}

.snk-grid tbody tr.snk-row-selected {
    background: #D0E4FF;
}

/* Checkbox column */
.snk-col-check { width: 28px; text-align: center; }
.snk-col-check input[type="checkbox"] {
    width: 13px; height: 13px; cursor: pointer;
    accent-color: var(--snk-blue);
}

/* Status cells */
.snk-status {
    display: inline-block;
    font-size: 11px;
    font-weight: bold;
    padding: 2px 6px;
    border-radius: 2px;
}

.snk-status-creating  { color: #E65100; background: #FFF3E0; border: 1px solid #FFB74D; }
.snk-status-success   { color: var(--snk-green); background: var(--snk-green-lt); border: 1px solid #81C784; }
.snk-status-error     { color: var(--snk-red); background: var(--snk-red-lt); border: 1px solid #EF9A9A; }
.snk-status-init      { color: #1565C0; background: #E3F2FD; border: 1px solid #90CAF9; }

/* Detalhe de erro inline (mensagem real do Sankhya) */
.snk-erro-detalhe {
    font-size: 11px;
    color: var(--snk-red);
    background: var(--snk-red-lt);
    border: 1px solid #EF9A9A;
    border-radius: 4px;
    padding: 4px 8px;
    margin: 4px 0;
    word-break: break-word;
    max-width: 300px;
}

/* Status badges for cancel tab */
.status-badge { display: inline-block; font-size: 11px; font-weight: bold; padding: 2px 6px; border-radius: 2px; }
.status-badge.liberada    { color: var(--snk-green); background: var(--snk-green-lt); border: 1px solid #81C784; }
.status-badge.cancelada   { color: var(--snk-red);   background: var(--snk-red-lt);   border: 1px solid #EF9A9A; }
.status-badge.finalizada  { color: #1565C0; background: #E3F2FD; border: 1px solid #90CAF9; }
.status-badge.suspensa    { color: var(--snk-orange); background: #FFF3E0; border: 1px solid #FFB74D; }
.status-badge.andamento   { color: var(--snk-orange); background: #FFF3E0; border: 1px solid #FFB74D; }

.snk-rodada-cell   { color: var(--snk-text-muted); }
.snk-rodada-gerada { color: var(--snk-blue); font-weight: bold; }

/* Retry button inline */
.btn-retry {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border: 1px solid var(--snk-orange);
    background: #FFF3E0;
    color: var(--snk-orange);
    font-size: 11px;
    font-weight: bold;
    border-radius: 2px;
    cursor: pointer;
    font-family: inherit;
}
.btn-retry:hover { background: var(--snk-orange); color: #fff; }

.btn-cancel-row {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border: 1px solid var(--snk-red);
    background: var(--snk-red-lt);
    color: var(--snk-red);
    font-size: 11px;
    font-weight: bold;
    border-radius: 2px;
    cursor: pointer;
    font-family: inherit;
}
.btn-cancel-row:hover:not(:disabled) { background: var(--snk-red); color: #fff; }
.btn-cancel-row:disabled { opacity: 0.4; cursor: not-allowed; }

/* ===== STATUS BAR ===== */
.snk-statusbar {
    background: linear-gradient(180deg, #D4DCE8 0%, #C6CFD8 100%);
    border: 1px solid var(--snk-border);
    border-radius: 3px;
    padding: 4px 10px;
    font-size: 11px;
    color: var(--snk-text-muted);
    display: flex;
    gap: 16px;
}

/* ===== TOAST ===== */
.toast {
    position: fixed;
    bottom: 24px;
    right: 24px;
    background: var(--snk-navy);
    border-left: 4px solid #FF9800;
    padding: 10px 16px;
    border-radius: 3px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.35);
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    z-index: 1000;
    max-width: 360px;
    transition: opacity 0.25s, transform 0.25s;
}

.toast.success  { border-left-color: #4CAF50; }
.toast.error    { border-left-color: #EF5350; }
.toast.info     { border-left-color: var(--snk-blue); }

.toast.hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
}

/* ===== Modal Motivo Cancelamento ===== */
.modal-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,.45);
    display: flex; align-items: center; justify-content: center;
    z-index: 1000;
}
.modal-overlay.hidden { display: none; }
.modal-box {
    background: var(--snk-surface);
    border-radius: 6px;
    width: 420px; max-width: 95vw;
    box-shadow: 0 8px 32px rgba(0,0,0,.25);
    overflow: hidden;
}
.modal-header {
    background: var(--snk-red);
    color: #fff;
    padding: 12px 16px;
    font-weight: 700;
    font-size: 0.95rem;
}
.modal-body { padding: 16px; }
.modal-footer {
    padding: 12px 16px;
    display: flex; gap: 8px; justify-content: flex-end;
    border-top: 1px solid var(--snk-border);
    background: var(--snk-bg);
}