:root{
    --bg: #f0f0f2;
    --card: #ffffff;
    --surface: rgba(255,255,255,0.8);
    --border: rgba(0,0,0,0.08);
    --shadow: 0 20px 40px rgba(35,28,43,0.08);
    --accent: #6b0f17;
    --accent-soft: rgba(107,15,23,0.12);
    --text: #222;
    --text-muted: #5a5a5f;
    --success: #2f8f68;
    --danger: #c02a36;
    --app-max-width: 1200px;
    --app-gutter: clamp(16px, 4vw, 32px);
    --app-header-min-height: 52px;
}
html{min-height:100%;}
body{
    margin:0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background: linear-gradient(180deg, #ececec 0%, #f7f7f9 100%);
    color: var(--text);
}
.app-body{
    min-height:100vh;
    background:linear-gradient(180deg, #ececec 0%, #f7f7f9 100%);
}
a{color:var(--accent);text-decoration:none;}
a:hover{text-decoration:underline;}
.auth-body{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
}
.app-shell{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    width:100%;
}
.app-container{
    width:100%;
    max-width:var(--app-max-width);
    margin:0 auto;
    padding:0 var(--app-gutter);
    box-sizing:border-box;
}
.app-header{
    display:flex;
    align-items:center;
    padding:8px 0;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--border);
    box-shadow:0 10px 30px rgba(0,0,0,0.05);
    position:sticky;
    top:0;
    z-index:10;
    width:100%;
    box-sizing:border-box;
}
.app-header__inner{
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    column-gap:24px;
    min-height:var(--app-header-min-height);
    transition:all 0.25s ease;
}
.app-header__logo{
    display:flex;
    align-items:center;
    justify-content:center;
    align-self:stretch;
    height:100%;
    flex-shrink:0;
    flex:0 0 auto;
}
.app-header__logo-link{
    display:flex;
    align-items:center;
    justify-content:center;
    height:100%;
    padding:0 8px;
    transition:transform 0.2s ease;
}
.app-header__logo-link:focus-visible{
    outline:2px solid var(--accent);
    outline-offset:2px;
}
.app-header__logo-link:hover{
    transform:translateY(-1px);
}
.app-header__logo-image{
    display:block;
    height:calc(var(--app-header-min-height) * 0.9);
    max-height:calc(var(--app-header-min-height) * 0.9);
    width:auto;
}
.app-header__title{
    display:flex;
    align-items:center;
    justify-content:center;
    justify-self:center;
    min-width:0;
    text-align:center;
    transition:all 0.25s ease;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.app-header__title h1{
    margin:0;
    font-size:20px;
    font-weight:600;
    color:var(--text);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.app-header__user{
    display:inline-flex;
    justify-content:flex-end;
    align-items:center;
    gap:12px;
    flex-shrink:0;
    flex:0 0 auto;
}
.user-menu{
    position:relative;
    display:inline-flex;
}
.user-menu[open] .user-avatar{
    box-shadow:0 0 0 3px var(--accent-soft);
}
.user-menu-toggle{
    list-style:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    border:0;
    background:transparent;
    padding:0;
}
.user-menu-toggle::marker{display:none;}
.user-menu-toggle::-webkit-details-marker{display:none;}
.user-avatar{
    width:36px;
    height:36px;
    border-radius:50%;
    background:var(--accent);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:transform 0.2s ease, box-shadow 0.2s ease, width 0.25s ease, height 0.25s ease;
}
.user-avatar svg{
    width:22px;
    height:22px;
    fill:currentColor;
}
.user-menu:hover .user-avatar{
    transform:translateY(-1px);
}
.user-menu-panel{
    position:absolute;
    top:calc(100% + 12px);
    right:0;
    width:240px;
    background:#fff;
    border-radius:12px;
    box-shadow:var(--shadow);
    border:1px solid var(--border);
    padding:18px;
    display:flex;
    flex-direction:column;
    gap:14px;
    animation:menu-fade-in 0.15s ease-in-out;
}
@keyframes menu-fade-in{
    from{opacity:0;transform:translateY(-6px);}
    to{opacity:1;transform:translateY(0);}
}
.user-info{
    display:flex;
    flex-direction:column;
    gap:4px;
}
.user-name{
    font-weight:600;
    font-size:15px;
    color:var(--text);
}
.user-email{
    font-size:13px;
    color:var(--text-muted);
    word-break:break-word;
}
.app-toolbar{
    padding:12px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:transparent;
    gap:12px;
    flex-wrap:wrap;
}
.app-content{
    flex:1;
    width:100%;
    padding:32px 0;
    display:flex;
    flex-direction:column;
    gap:24px;
}
.app-footer{
    background:rgba(255,255,255,0.9);
    border-top:1px solid var(--border);
}
.app-footer__inner{
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:8px;
    font-size:13px;
    color:var(--text-muted);
    padding:18px 0;
}

/* Buttons */
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:10px 18px;
    border-radius:10px;
    font-size:14px;
    font-weight:600;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}
.btn:focus{
    outline:2px solid var(--accent);
    outline-offset:2px;
}
.btn-primary{
    background:var(--accent);
    color:#fff;
    border-color:var(--accent);
    box-shadow:0 10px 20px rgba(107,15,23,0.16);
}
.btn-primary:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 24px rgba(107,15,23,0.22);
}
.btn-success{
    background:#2f8f68;
    color:#fff;
    border-color:#2f8f68;
    box-shadow:0 10px 20px rgba(47,143,104,0.18);
}
.btn-success:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 26px rgba(47,143,104,0.26);
}
.btn-warning{
    background:#f0a202;
    color:#212529;
    border-color:#f0a202;
    box-shadow:0 10px 20px rgba(240,162,2,0.18);
}
.btn-warning:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 26px rgba(240,162,2,0.26);
}
.btn-danger{
    background:#c02a36;
    color:#fff;
    border-color:#c02a36;
    box-shadow:0 10px 20px rgba(192,42,54,0.18);
}
.btn-danger:hover{
    transform:translateY(-1px);
    box-shadow:0 14px 26px rgba(192,42,54,0.28);
}
.btn-secondary{
    background:#fff;
    border-color:var(--accent);
    color:var(--accent);
}
.btn-secondary:hover{
    background:var(--accent);
    color:#fff;
}
.btn-outline{
    background:transparent;
    color:var(--accent);
    border-color:var(--accent);
}
.btn-outline:hover{
    background:var(--accent-soft);
    color:var(--accent);
}
.btn-ghost{
    background:transparent;
    color:var(--accent);
    border-color:transparent;
}
.btn-ghost:hover{
    background:var(--accent-soft);
}
.btn-link{
    background:transparent;
    border:none;
    color:var(--accent);
    padding:0;
}
.btn-block{
    width:100%;
}
.btn-lg{
    min-width:220px;
    padding:12px 28px;
}
.btn-group-responsive{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content:center;
}
.btn-group-responsive .btn{
    flex:1 1 220px;
    max-width:280px;
}
.btn-group-responsive form{
    display:flex;
    justify-content:center;
}

/* Cards and panels */
.card{
    background:rgba(255,255,255,0.94);
    border-radius:16px;
    border:1px solid var(--border);
    box-shadow:var(--shadow);
    padding:24px;
}
.card-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:18px;
}
.card-title{
    margin:0;
    font-size:18px;
    font-weight:600;
}
.card-body{
    display:flex;
    flex-direction:column;
    gap:16px;
}
.card-text{
    margin:0;
    font-size:15px;
    color:var(--text-muted);
}
.card-actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}
.card-footer{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:24px;
    padding-top:16px;
    border-top:1px solid var(--border);
    font-size:13px;
    color:var(--text-muted);
}
.note-inline{
    display:flex;
    align-items:center;
    gap:8px;
}

/* Forms */
.form-section{
    display:flex;
    flex-direction:column;
    gap:18px;
}
.form-group{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.form-group.inline{
    flex-direction:row;
    align-items:center;
    gap:12px;
}
.form-label{
    font-size:14px;
    font-weight:600;
    color:var(--text);
    gap:6px;
}
.form-label.with-icon{
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.info-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:18px;
    height:18px;
    border-radius:50%;
    background:var(--accent-soft);
    color:var(--accent);
    font-size:11px;
    font-weight:600;
    cursor:help;
}
.choice-row{
    display:flex;
    gap:16px;
    flex-wrap:wrap;
}
.choice-item{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    color:var(--text);
}
.choice-item input{margin:0;}
.form-actions{
    display:flex;
    justify-content:flex-end;
    gap:12px;
}
.form-control,
input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="date"], input[type="time"], input[type="file"], input[type="url"], textarea, select{
    width:100%;
    padding:12px 14px;
    border-radius:10px;
    border:1px solid #d6d6d8;
    background:#fbfbfb;
    font-size:14px;
    color:var(--text);
    box-sizing:border-box;
    transition:border-color 0.16s ease, box-shadow 0.16s ease;
}
.form-control:focus,
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="date"]:focus, input[type="time"]:focus, input[type="file"]:focus, input[type="url"]:focus, textarea:focus, select:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 3px var(--accent-soft);
    outline:none;
}
textarea{
    min-height:120px;
    resize:vertical;
}
input[type="checkbox"], input[type="radio"]{
    width:auto;
    display:inline-flex;
}
.input-sm{
    max-width:150px;
}
.form-helper{
    font-size:13px;
    color:var(--text-muted);
}

/* Tables */
.table{
    width:100%;
    border-collapse:collapse;
    background:rgba(255,255,255,0.94);
    border-radius:14px;
    overflow:hidden;
    box-shadow:var(--shadow);
}
.table thead{
    background:var(--accent-soft);
    color:var(--accent);
    text-transform:uppercase;
    font-size:12px;
    letter-spacing:0.5px;
}
.table th, .table td{
    padding:14px 16px;
    border-bottom:1px solid var(--border);
    text-align:left;
    font-size:14px;
}
.table tbody tr:hover{
    background:rgba(107,15,23,0.06);
}
.table-wrapper{
    width:100%;
    overflow-x:auto;
}

/* Feedback */
.alert{
    border-radius:12px;
    padding:14px 16px;
    font-size:14px;
    border:1px solid transparent;
}
.alert-success{
    background:rgba(47,143,104,0.12);
    border-color:rgba(47,143,104,0.32);
    color:var(--success);
}
.alert-danger{
    background:rgba(192,42,54,0.12);
    border-color:rgba(192,42,54,0.32);
    color:var(--danger);
}
.alert-warning{
    background:rgba(255,193,7,0.16);
    border-color:rgba(255,193,7,0.28);
    color:#8a6d00;
}
.unstyled-list{
    list-style:none;
    padding:0;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.error-list{
    background:#fff0f0;
    border:1px solid #ffd6d8;
    color:#8b1a1f;
    padding:12px;
    border-radius:8px;
    margin-top:12px;
}
.error-message{
    background:rgba(192,42,54,0.1);
    border:1px solid rgba(192,42,54,0.25);
    color:var(--danger);
    padding:12px 14px;
    border-radius:10px;
}
.badge{
    display:inline-flex;
    align-items:center;
    padding:4px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:600;
    background:var(--accent-soft);
    color:var(--accent);
}
.badge-neutral{
    background:rgba(34,34,34,0.08);
    color:var(--text);
}

.module-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:18px;
}
.module-card{
    background:rgba(255,255,255,0.92);
    border:1px solid transparent;
    border-radius:14px;
    padding:20px;
    box-shadow:0 10px 24px rgba(0,0,0,0.05);
    display:flex;
    align-items:flex-start;
    gap:16px;
    transition:transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
    color:inherit;
}
.module-card__body{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.module-icon{
    width:40px;
    height:40px;
    border-radius:12px;
    background:var(--accent-soft);
    color:var(--accent);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    box-shadow:0 6px 16px rgba(107,15,23,0.12);
}
.module-icon svg{
    width:20px;
    height:20px;
    stroke:currentColor;
    fill:none;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.module-card h3{
    margin:0;
    font-size:17px;
    font-weight:600;
}
.module-card p{
    margin:0;
    font-size:14px;
    color:var(--text-muted);
}
.module-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 36px rgba(107,15,23,0.18);
    border-color:var(--accent);
}

.centered-card{
    max-width:420px;
    margin:0 auto;
    text-align:center;
}

.success-list{
    display:flex;
    flex-direction:column;
    gap:12px;
}
.success-item{
    background:rgba(47,143,104,0.12);
    border:1px solid rgba(47,143,104,0.28);
    color:var(--success);
    padding:12px 14px;
    border-radius:10px;
}
.sku-collection{
    display:flex;
    flex-direction:column;
    gap:10px;
}
.sku-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 12px;
    border-radius:10px;
    background:rgba(34,34,34,0.05);
    border:1px solid var(--border);
}
.sku-remove{
    cursor:pointer;
    color:var(--danger);
    font-weight:600;
    border:none;
    background:transparent;
}

/* Revisão module */
.revisao-wrapper{
    display:flex;
    flex-direction:column;
    gap:24px;
}
.revisao-filters{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    align-items:flex-end;
}
.revisao-filter{
    flex:1 1 220px;
    min-width:200px;
}
.sku-container{
    display:flex;
    flex-direction:column;
    gap:12px;
}
.skus-row{
    display:flex;
    overflow-x:auto;
    gap:12px;
    padding:12px;
    border-radius:12px;
    background:rgba(34,34,34,0.05);
    border:1px solid var(--border);
}
.skus-row::-webkit-scrollbar{
    height:6px;
}
.skus-row::-webkit-scrollbar-thumb{
    background:rgba(34,34,34,0.25);
    border-radius:999px;
}
.sku-item{
    min-width:120px;
    padding:12px;
    border:2px solid transparent;
    border-radius:12px;
    background:#fff;
    box-shadow:0 6px 12px rgba(0,0,0,0.06);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    cursor:pointer;
    transition:transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.sku-item:hover{
    transform:translateY(-2px);
    border-color:var(--accent);
    box-shadow:0 10px 20px rgba(0,0,0,0.12);
}
.sku-item.selected{
    border-color:var(--success);
    box-shadow:0 12px 24px rgba(47,143,104,0.24);
    background:rgba(47,143,104,0.08);
}
.sku-thumb{
    width:90px;
    height:90px;
    object-fit:cover;
    border-radius:10px;
    border:1px solid var(--border);
}
.placeholder{
    width:90px;
    height:90px;
    border-radius:10px;
    border:1px dashed var(--accent);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    color:var(--accent);
    background:var(--accent-soft);
}
.revisao-form-card{
    display:flex;
    flex-direction:column;
    gap:18px;
}
.revisao-form-layout{
    display:flex;
    gap:24px;
    flex-wrap:wrap;
}
.revisao-column-left{
    flex:1 1 360px;
    max-width:520px;
    display:flex;
    flex-direction:column;
    gap:18px;
}
.revisao-column-right{
    flex:1 1 320px;
    display:flex;
}
.revision-photo-card,
.revision-info-card{
    display:flex;
    flex-direction:column;
    gap:16px;
}
.revision-photo-card{
    padding:0;
}
.revision-photo-shell{
    width:100%;
    padding:18px 18px 20px;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    gap:18px;
}
.revision-photo-stage{
    position:relative;
    width:100%;
}
.revision-photo-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    width:100%;
}
.revision-photo-title{
    margin:0;
    text-align:left;
}
.revision-photo-rotate{
    border:none;
    background:transparent;
    box-shadow:none;
    width:38px;
    height:38px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    color:#111;
    cursor:pointer;
    transition:transform 0.15s ease, box-shadow 0.15s ease;
}
.revision-photo-rotate:disabled{
    opacity:0.45;
    cursor:not-allowed;
    box-shadow:none;
}
.revision-photo-rotate:not(:disabled):hover{
    transform:scale(1.05);
    color:var(--accent-dark, #6b0f17);
}
.revision-carousel{
    display:flex;
    flex-direction:column;
    gap:12px;
}
.revision-carousel-controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
}
.revision-carousel-note{
    font-size:12px;
    color:var(--text-muted);
    text-align:center;
}
.carousel-zoom-frame{
    position:relative;
    display:block;
    width:100%;
    overflow:hidden;
    border-radius:12px;
    text-decoration:none;
    color:inherit;
    background:#fff;
}
.carousel-zoom-frame img{
    display:block;
    margin:0 auto;
    max-width:100%;
    max-height:420px;
    width:auto;
    height:auto;
    object-fit:contain;
    transition:transform 0.25s ease, transform-origin 0.15s ease;
    will-change:transform;
}
.carousel-zoom-frame.zoom-active{
    cursor:move;
}
.revision-info-actions{
    display:flex;
    justify-content:center;
}
.revision-meta-divider{
    border-bottom:1px solid var(--border);
    margin:12px 0;
}
.revision-title-preview{
    font-family:"Segoe UI", Tahoma, sans-serif;
    font-size:15px;
    font-weight:600;
    word-break:break-word;
}
.revisao-search-container{
    position:relative;
    display:block;
}
.revisao-suggestions{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    z-index:20;
    background:#fff;
    border:1px solid var(--border);
    border-top:none;
    max-height:420px;
    overflow-y:auto;
    border-radius:0 0 12px 12px;
    box-shadow:var(--shadow);
    margin-top:6px;
}
.revisao-suggestions .revisao-suggestion{
    display:flex;
    align-items:center;
    gap:12px;
    padding:6px 14px;
    cursor:pointer;
    transition:background 0.16s ease;
    min-height:56px;
    box-sizing:border-box;
}
.revisao-suggestions .revisao-suggestion:hover,
.revisao-suggestions .revisao-suggestion.active{
    background:rgba(107,15,23,0.08);
}
.revisao-suggestion-type{
    width:46px;
    min-width:46px;
    max-width:46px;
    border-radius:8px;
    background:#f4f6fb;
    border:1px solid rgba(15,23,42,0.08);
    font-weight:700;
    font-size:0.75rem;
    color:#1f2937;
    display:flex;
    align-items:center;
    justify-content:center;
    text-transform:uppercase;
    letter-spacing:0.02em;
}
.revisao-suggestion-type.revisao-suggestion-type--match{
    background:#d8f9d1;
    color:#0f5132;
    border-color:rgba(16,185,129,0.4);
}
.revisao-suggestion-thumb{
    width:50px;
    height:50px;
    border-radius:8px;
    background:transparent;
    border:1px solid rgba(0,0,0,0.05);
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    flex-shrink:0;
    padding:5px;
    box-sizing:border-box;
}
.revisao-suggestion-thumb img{
    width:40px;
    height:40px;
    object-fit:cover;
    display:block;
}
.revisao-suggestion-thumb.is-placeholder{
    background:#f0f2f5;
    color:#64748b;
    font-size:1rem;
}
.revisao-suggestion-thumb-icon{
    display:block;
    line-height:1;
}
.revisao-suggestion-info{
    flex:1;
    min-width:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    height:100%;
    text-align:left;
}
.revisao-suggestion-title,
.revisao-suggestion-author{
    display:flex;
    align-items:center;
    height:25px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1;
}
.revisao-suggestion-title{
    font-weight:600;
    font-size:0.9rem;
    color:#111;
}
.revisao-suggestion-author{
    font-size:0.82rem;
    color:#4b5563;
}
.revisao-alerta-midia{
    margin-top:6px;
    display:flex;
    align-items:center;
    gap:6px;
    padding:8px 10px;
    border-radius:8px;
    background:rgba(255,159,67,0.15);
    border:1px solid rgba(236,117,0,0.4);
    color:#8a4600;
    font-size:0.9rem;
}
.revisao-alerta-icone{
    font-weight:700;
    font-size:1rem;
    color:#c05621;
    line-height:1;
}
.revisao-alerta-texto{
    flex:1;
}
.revisao-edit-actions{
    display:none;
    margin-bottom:15px;
    gap:12px;
    flex-wrap:wrap;
}
#botao_submissao{
    display:none;
    margin-top:20px;
    gap:12px;
}
.campo-preco-input{
    width:100%;
    padding:12px 14px;
    border:1px solid #f4c97f;
    border-radius:10px;
    background-color:#fff9ed;
    font-weight:600;
    transition:border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
.campo-preco-input:focus{
    border-color:#f0b44d;
    background-color:#fff4dc;
    box-shadow:0 0 0 3px rgba(240,180,77,0.2);
    outline:none;
}
.revisao-loading{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:32px 0;
    color:var(--text-muted);
    font-size:15px;
}
.revisao-debug-panel{
    display:none;
    background:rgba(34,34,34,0.04);
    border:1px solid var(--border);
    border-radius:12px;
    padding:16px;
    font-size:13px;
}
.revisao-success{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
    padding:32px 0;
    color:var(--success);
    font-weight:600;
}
.revisao-success .icone-sucesso{
    width:72px;
    height:72px;
    border-radius:999px;
    background:var(--success);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:36px;
    box-shadow:0 18px 36px rgba(47,143,104,0.28);
}
.revisao-progress-modal{
    position:fixed;
    inset:0;
    background:rgba(13,13,13,0.45);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:1500;
    padding:20px;
    transition:opacity 0.2s ease;
}
.revisao-progress-modal.hidden{
    opacity:0;
    pointer-events:none;
}
.revisao-progress-modal__content{
    max-width:360px;
    width:100%;
    background:#fff;
    border-radius:18px;
    padding:24px;
    box-shadow:0 24px 60px rgba(0,0,0,0.25);
    display:flex;
    flex-direction:column;
    gap:16px;
    text-align:center;
}
.revisao-progress-modal__text{
    margin:0;
    font-weight:600;
    color:#222;
}
.revisao-progress-bar{
    width:100%;
    height:10px;
    border-radius:999px;
    background:rgba(15,23,42,0.08);
    overflow:hidden;
}
.revisao-progress-bar__fill{
    height:100%;
    background:linear-gradient(90deg, #6b0f17, #f38d68);
    width:0;
    transition:width 0.2s ease;
}
.btn-sm{
    padding:6px 12px;
    font-size:12px;
    border-radius:8px;
}
.btn-icon{
    display:inline-flex;
    align-items:center;
    gap:6px;
}
.exportacao-container{
    max-width:1300px;
    margin:-8px auto 40px;
    padding:0 20px 40px;
    display:flex;
    flex-direction:column;
    gap:16px;
}
.exportacao-container .filters-row{
    display:flex;
    gap:20px;
    align-items:flex-end;
    margin-bottom:0;
    flex-wrap:wrap;
}
.exportacao-container .filter-column{
    flex:1 1 260px;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.exportacao-container .filter-column label{
    font-weight:600;
    font-size:13px;
    color:#444;
}
.exportacao-container .filter-column select,
.exportacao-container .filter-column input{
    padding:8px 10px;
    border:1px solid #cfd4d9;
    border-radius:6px;
    font-size:14px;
    height:36px;
    box-sizing:border-box;
    background:#fff;
    color:var(--text);
}
.exportacao-container .search-input-wrapper{
    display:flex;
    gap:8px;
    align-items:center;
}
.exportacao-container .table-toolbar{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:12px;
    margin-top:4px;
    margin-bottom:0;
    flex-wrap:wrap;
}
.exportacao-container .table-toolbar .toolbar-left,
.exportacao-container .table-toolbar .toolbar-right{
    display:flex;
    align-items:flex-end;
    gap:8px;
    flex-wrap:wrap;
}
.exportacao-container .table-toolbar label{
    font-weight:600;
    font-size:13px;
}
.exportacao-container .table-toolbar select{
    padding:8px 10px;
    border:1px solid #cfd4d9;
    border-radius:6px;
    font-size:14px;
    height:32px;
    min-width:110px;
    width:110px;
}
.exportacao-container #resultSummary{
    font-size:13px;
    color:#555;
    padding-bottom:4px;
}
.exportacao-table-window{
    position:relative;
    border:1px solid #d9dfe6;
    border-radius:8px;
    background:#fff;
    padding:0 10px 10px;
    max-height:440px;
    overflow:auto;
    box-shadow:0 1px 2px rgba(15,23,42,0.06);
}
.exportacao-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0;
    min-width:1100px;
    margin:0;
}
.exportacao-table th,
.exportacao-table td{
    padding:10px;
    border-bottom:1px solid #eef2f7;
    text-align:left;
    font-size:13px;
    color:#2f3542;
}
.exportacao-table th{
    background:#f1f5f9;
    font-weight:700;
    position:sticky;
    top:0;
    z-index:2;
}
.exportacao-table tbody tr:hover{
    background-color:rgba(0,123,255,0.06);
}
.exportacao-table .col-select{
    width:36px;
}
.exportacao-table .col-thumb,
.exportacao-table .thumb-cell{
    width:80px;
}
.exportacao-table .thumb-cell img{
    width:60px;
    height:60px;
    object-fit:cover;
    border-radius:4px;
    border:1px solid #d1d9e0;
    background:#fff;
}
.exportacao-table .thumb-placeholder{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:60px;
    height:60px;
    border-radius:4px;
    border:1px dashed #cbd4dc;
    color:#95a3b0;
    font-size:11px;
    text-transform:uppercase;
}
.exportacao-container .lista-placeholder{
    padding:32px 0;
    text-align:center;
    color:#666;
    font-size:14px;
}
.exportacao-container .error{
    color:#c0392b;
}
.exportacao-container .table-meta{
    display:none;
}
.exportacao-container .pagination{
    display:flex;
    flex-wrap:wrap;
    list-style:none;
    gap:6px;
    padding:12px 4px 4px;
    margin:10px 0 0;
}
.exportacao-container .pagination li{
    display:inline-block;
}
.exportacao-container .pagination a,
.exportacao-container .pagination span{
    display:inline-block;
    padding:6px 12px;
    border:1px solid #d1d9e0;
    border-radius:4px;
    font-size:13px;
    color:var(--accent);
    text-decoration:none;
    background:#fff;
}
.exportacao-container .pagination .active span{
    background:var(--accent);
    color:#fff;
    border-color:var(--accent);
}
.exportacao-container .pagination .disabled span{
    color:#99a3ad;
    border-color:#d1d9e0;
    cursor:default;
}
.exportacao-container .actions-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:0;
    gap:12px;
    flex-wrap:wrap;
}
.exportacao-container .actions-row__export{
    display:flex;
    align-items:center;
    gap:8px;
}
.exportacao-container .selected-counter{
    font-size:14px;
    color:#475569;
    white-space:nowrap;
}
.exportacao-container .btn{
    min-width:110px;
    height:36px;
    padding:8px 16px;
    box-sizing:border-box;
}
.exportacao-container .btn:disabled{
    opacity:0.6;
    cursor:not-allowed;
}
.export-feedback{
    margin-top:16px;
    padding:16px;
    border-radius:8px;
    border:1px solid #d1d9e0;
    background:#f8fafc;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
}
.export-feedback.hidden{
    display:none;
}
.export-feedback.success{
    border-color:#22c55e;
    background:#ecfdf3;
    color:#166534;
}
.export-feedback.warning{
    border-color:#f59e0b;
    background:#fffbeb;
    color:#92400e;
}
.export-feedback.error{
    border-color:#ef4444;
    background:#fef2f2;
    color:#991b1b;
}
.export-feedback .export-feedback-content{
    flex:1;
}
.export-feedback .feedback-details{
    margin-top:6px;
    padding:6px 8px;
    border-radius:4px;
    border:1px dashed rgba(148,163,184,0.6);
    background:rgba(226,232,240,0.25);
    font-size:12px;
    color:#1f2937;
}
#editarOverlay{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:2000;
}
#editarOverlay.hidden{
    display:none;
}
#editarOverlay .exportacao-overlay__backdrop{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(15,23,42,0.45);
}
#editarOverlay .exportacao-overlay__panel{
    position:relative;
    background:#fff;
    border-radius:12px;
    max-width:900px;
    width:92%;
    max-height:90vh;
    overflow-y:auto;
    box-shadow:0 18px 40px rgba(15,23,42,0.2);
    padding:24px;
}
#editarOverlay .overlay-loading,
#editarOverlay .overlay-error{
    padding:30px;
    text-align:center;
    font-size:15px;
    color:#444;
}
#editarOverlay .editar-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
}
#editarOverlay .editar-header h2{
    margin:0;
    font-size:20px;
    color:#1f2937;
}
#editarOverlay .overlay-close{
    border:none;
    background:transparent;
    font-size:26px;
    line-height:1;
    cursor:pointer;
    color:#6b7280;
}
#editarOverlay .overlay-close:hover{
    color:#111827;
}
#editarOverlay .editar-body{
    display:flex;
    flex-direction:column;
    gap:20px;
}
#editarOverlay .editar-contexto{
    margin:0;
    font-size:13px;
    color:#4b5563;
    background:#f1f5f9;
    padding:12px 16px;
    border-radius:6px;
}
#editarOverlay .editar-status{
    display:none;
    padding:10px 14px;
    border-radius:6px;
    font-size:13px;
    line-height:1.4;
    margin-top:16px;
}
#editarOverlay .editar-status.is-visible{
    display:block;
}
#editarOverlay .editar-status--info{
    background:#e0f2fe;
    color:#075985;
}
#editarOverlay .editar-status--success{
    background:#dcfce7;
    color:#166534;
}
#editarOverlay .editar-status--error{
    background:#fee2e2;
    color:#991b1b;
}
#editarOverlay .editar-section{
    margin-top:10px;
}
#editarOverlay .editar-section h3{
    margin:0 0 12px;
    font-size:16px;
    color:#1f2937;
}
#editarOverlay .form-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap:12px 16px;
}
#editarOverlay .form-field{
    display:flex;
    flex-direction:column;
    gap:6px;
}
#editarOverlay .editar-sem-imagens{
    margin:0;
    font-size:13px;
    color:#64748b;
}
#editarOverlay .editar-fotos-wrapper{
    overflow-x:auto;
    margin-top:12px;
}
#editarOverlay .editar-fotos-tabela{
    width:100%;
    border-collapse:collapse;
    min-width:540px;
    font-size:13px;
}
#editarOverlay .editar-fotos-tabela th,
#editarOverlay .editar-fotos-tabela td{
    padding:8px 10px;
    border-bottom:1px solid #dbe3ec;
    text-align:left;
    vertical-align:middle;
}
#editarOverlay .editar-fotos-tabela tbody tr:hover{
    background:#f1f5f9;
}
#editarOverlay .editar-fotos-tabela th{
    background:#f8fafc;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:0.04em;
    color:#475569;
}
#editarOverlay .foto-ordem-col{
    white-space:nowrap;
    width:70px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
}
#editarOverlay .foto-ordem-col input[type="hidden"]{
    display:none;
}
#editarOverlay .foto-ordem__handle{
    display:inline-block;
    cursor:grab;
    font-weight:700;
    color:#475569;
    user-select:none;
    font-size:16px;
    line-height:1;
}
#editarOverlay .foto-ordem__handle:active{
    cursor:grabbing;
}
#editarOverlay .foto-ordem__index{
    font-weight:600;
    color:#111827;
    line-height:1;
}
#editarOverlay .foto-preview-col{
    width:70px;
}
#editarOverlay .foto-preview{
    width:50px;
    height:50px;
    border-radius:6px;
    object-fit:cover;
    border:1px solid #cfd4d9;
    background:#f8fafc;
}
#editarOverlay .foto-url-col input{
    width:100%;
    border:1px solid #cfd4d9;
    border-radius:6px;
    padding:6px 8px;
    font-size:13px;
    box-sizing:border-box;
    background:#fff;
    color:var(--text);
}
#editarOverlay .editar-fotos-tabela tbody tr[draggable="true"]{
    cursor:grab;
}
#editarOverlay .editar-fotos-tabela tr.is-dragging{
    opacity:0.6;
    cursor:grabbing;
}
#editarOverlay .editar-fotos-tabela tr.is-drop-target{
    outline:2px dashed #3b82f6;
    outline-offset:-2px;
}
#editarOverlay .form-field label{
    font-size:13px;
    font-weight:600;
    color:#374151;
}
#editarOverlay .form-field input,
#editarOverlay .form-field select,
#editarOverlay .form-field textarea{
    border:1px solid #cfd4d9;
    border-radius:6px;
    padding:8px 10px;
    font-size:14px;
    box-sizing:border-box;
    background:#fff;
    color:var(--text);
}
#editarOverlay .form-field textarea{
    resize:vertical;
    min-height:90px;
}
#editarOverlay .form-field.full-width{
    grid-column:1 / -1;
}
#editarOverlay .editar-footer{
    display:flex;
    justify-content:flex-end;
    gap:12px;
    margin-top:20px;
}
#btnSalvarEdicao:disabled{
    opacity:0.6;
    cursor:not-allowed;
}
@media (max-width:768px){
    .exportacao-table{
        min-width:900px;
    }
    .exportacao-container .btn{
        min-width:90px;
    }
}
.stack-xs{
    display:flex;
    flex-direction:column;
    gap:8px;
}
#novo_lancamento_checkbox{
    width:16px;
    height:16px;
    cursor:pointer;
}
#campos_lancamento{
    transition:all 0.3s ease;
}
#campos_lancamento input:disabled{
    background-color:#f5f5f5;
    cursor:not-allowed;
    color:#555;
}
.loading{
    text-align:center;
    padding:20px;
    color:var(--text-muted);
}

/* Utilities */
.text-center{text-align:center;}
.text-right{text-align:right;}
.mt-xs{margin-top:6px;}
.mt-sm{margin-top:12px;}
.mt-md{margin-top:18px;}
.mt-lg{margin-top:24px;}
.fw-semibold{font-weight:600;}
.stack{
    display:flex;
    flex-direction:column;
    gap:16px;
}

/* Login page */
.login-wrap{
    width:420px;
    max-width:92vw;
    background:#fff;
    border-radius:16px;
    box-shadow:var(--shadow);
    overflow:hidden;
    border-top:8px solid var(--accent);
}
.login-card{
    padding:32px 36px;
    display:flex;
    flex-direction:column;
    gap:18px;
}
.brand{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0;
}
.brand-logo{
    display:block;
    height:calc(var(--app-header-min-height) * 0.9);
    max-height:80px;
    width:auto;
}
.subtitle{
    color:var(--text-muted);
    font-size:14px;
    margin:4px 0 0;
    text-align:center;
}
.form-login{
    display:flex;
    flex-direction:column;
    gap:18px;
}
.actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
}
.remember-area{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    color:var(--text-muted);
}
.link-muted{
    color:#888;
    font-size:13px;
    text-decoration:none;
}
.link-muted:hover{
    color:var(--accent);
}

.hidden{display:none;}
.sr-only{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
}

@media (max-width:1100px){
    .app-header__title h1{
        font-size:18px;
    }
}
@media (max-width:900px){
    .app-header{
        padding:8px 0;
    }
    .app-header__inner{
        column-gap:18px;
    }
    .app-content{
        padding:24px 0;
    }
}
@media (max-width:720px){
    :root{
        --app-header-min-height: 48px;
    }
    .app-header{
        padding:8px 0;
    }
    .app-header__inner{
        column-gap:16px;
    }
    .app-header__title h1{
        font-size:17px;
    }
}
@media (max-width:600px){
    :root{
        --app-header-min-height: 46px;
    }
    .app-header{
        padding:8px 0;
    }
    .app-header__inner{
        grid-template-columns:1fr auto;
    }
    .app-header__logo{
        display:none;
    }
    .app-header__title{
        justify-self:flex-start;
        justify-content:flex-start;
        text-align:left;
    }
    .app-footer__inner{
        padding:16px 0;
    }
    .login-card{
        padding:28px 24px;
    }
}
@media (max-width:540px){
    :root{
        --app-header-min-height: 44px;
    }
    .app-header__inner{
        column-gap:12px;
    }
    .app-header__title h1{
        font-size:16px;
    }
    .user-avatar{
        width:32px;
        height:32px;
    }
}
@media (max-width:420px){
    :root{
        --app-header-min-height: 42px;
    }
    .app-header{
        padding:6px 0;
    }
    .app-header__title h1{
        font-size:15px;
    }
}
@media (max-width:480px){
    .login-wrap{
        width:94vw;
    }
    .actions{
        flex-direction:column;
        align-items:stretch;
    }
    .btn{
        width:100%;
    }
}
.app-modal{
    position:fixed;
    inset:0;
    background:rgba(18,12,24,0.55);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    z-index:1000;
}
.app-modal.hidden{
    display:none;
}
.app-modal__content{
    background:#fff;
    border-radius:16px;
    padding:24px;
    width:min(420px, 100%);
    box-shadow:0 18px 40px rgba(0,0,0,0.16);
    display:flex;
    flex-direction:column;
    gap:18px;
    text-align:center;
}
.app-modal__actions{
    display:flex;
    flex-direction:column;
    gap:12px;
}
.progress-modal[hidden]{
    display:none !important;
}
.progress-modal{
    position:fixed;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(15,23,42,0.55);
    z-index:1200;
}
.progress-modal__card{
    background:#fff;
    border-radius:16px;
    padding:32px 28px;
    width:min(480px, 92vw);
    box-shadow:0 20px 45px rgba(15,23,42,0.25);
    text-align:center;
    display:flex;
    flex-direction:column;
    gap:18px;
}
.progress-modal__stats{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:12px;
    font-size:0.9rem;
}
.progress-modal__stats span{
    display:block;
    color:#6b7280;
    font-size:0.8rem;
}
.progress-modal__stats strong{
    display:block;
    font-size:1.25rem;
    color:#0f172a;
}
.progress-modal__bar{
    width:100%;
    height:8px;
    border-radius:999px;
    overflow:hidden;
    background:#e5e7eb;
}
.progress-modal__bar-fill{
    width:var(--progress,0%);
    height:100%;
    background:linear-gradient(90deg,#2563eb,#7c3aed,#0ea5e9);
    transition:width .3s ease;
}
.progress-modal__hint{
    font-size:0.85rem;
    color:#6b7280;
}
.progress-modal__error{
    background:rgba(220,38,38,0.1);
    color:#b91c1c;
    border-radius:8px;
    padding:10px 12px;
    font-size:0.85rem;
}

/* Retriagem module */
.retriagem-wrapper{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.retriagem-grid{
    display:grid;
    grid-template-columns:2fr 3fr;
    gap:18px;
    align-items:start;
}

@media (max-width: 900px){
    .retriagem-grid{
        grid-template-columns:1fr;
    }
}

.retriagem-selected{
    display:flex;
    flex-direction:column;
    gap:8px;
    padding:12px;
    border-radius:12px;
    border:1px solid var(--border);
    background:rgba(34,34,34,0.03);
}

.retriagem-selected__sku{
    font-weight:700;
    color:var(--text);
    letter-spacing:0.2px;
}

.retriagem-motivo{
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:fit-content;
    padding:4px 10px;
    border-radius:999px;
    background:var(--accent-soft);
    border:1px solid var(--border);
    color:var(--accent);
    font-weight:600;
    font-size:0.85rem;
}

.retriagem-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 12px;
    border:1px solid var(--border);
    border-radius:12px;
    background:rgba(34,34,34,0.03);
}

.retriagem-row-left{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
}

.retriagem-row-thumb{
    width:44px;
    height:44px;
    border-radius:10px;
    border:1px solid var(--border);
    object-fit:cover;
    background:var(--card);
    flex:0 0 auto;
}

.retriagem-row-text{
    font-weight:600;
    color:var(--text);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
