:root{
  --primary-color:#2d2d2d;
  --primary-color-hover:#171717;
  --secondary-color:#000000;
  --light-color:#ffffff;
  --text-color-dark:#212529;
  --text-color-light:#ffffff;
  --text-color-medium:#6c757d;
  --text-color-light-gray:#adb5bd;
  --success-color:#198754;
  --danger-color:#dc3545;
  --warning-color:#ffc107;
  --info-color:#0dcaf0;
  --bg-color:#ffffff;
  --card-bg:#ffffff;
  --input-bg:#ffffff;
  --border-color:#e7e9ee;
  --table-header-bg:#fafbff;
  --table-striped-bg:#fafbff;
  --table-hover-bg:#f2f5ff;
  --menu-bg:#2d2d2d;
  --menu-hover-bg:#171717;
  --menu-text:#ffffff;
  --shadow-soft:0 10px 30px rgba(19,22,35,.07);
  --shadow-strong:0 24px 64px rgba(27,23,255,.22);
  --radius-lg:1.25rem;
  --radius-md:.9rem;
  --radius-sm:.55rem;
  --sidebar-collapsed:120px;
  --sidebar-expanded:320px;
  --easing:cubic-bezier(.2,.8,.2,1);
  --transition-fast:.16s var(--easing);
  --transition:.3s var(--easing);
  --kanban-backlog:#b6c3d6;
  --kanban-todo:#7e8cff;
  --kanban-doing:#5bd2c4;
  --kanban-review:#ffb84d;
  --kanban-done:#67c26f
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
html{box-sizing:border-box;height:100%}
*,*::before,*::after{box-sizing:inherit}
body{
  min-height:100dvh;margin:0;color:var(--text-color-dark);background-color:var(--bg-color);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  transition:background-color var(--transition),color var(--transition);padding:1rem
}
body.has-sidebar{display:flex;gap:1rem;padding:1rem}
h1,h2,h3,h4,h5,h6{color:var(--text-color-dark);font-weight:700}
a{color:var(--primary-color);text-decoration:none}
a:hover{color:var(--primary-color-hover)}
.btn{
  border-radius:50rem!important;padding-inline:1.5rem;font-weight:500;
  transition:transform var(--transition-fast),box-shadow var(--transition-fast),background-color var(--transition-fast),border-color var(--transition-fast)
}
.btn-lg{padding-inline:2rem}
.btn-sm{padding-inline:1rem;border-radius:50rem!important}
.btn-primary{background-color:var(--primary-color);border-color:var(--primary-color);color:var(--text-color-light)}
.btn-primary:hover{background-color:var(--primary-color-hover);border-color:var(--primary-color-hover);color:var(--text-color-light);transform:translateY(-2px);box-shadow:0 6px 18px rgba(27,23,255,.25)}
.btn-outline-primary{color:var(--primary-color);border-color:var(--primary-color)}
.btn-outline-primary:hover{background-color:var(--primary-color);border-color:var(--primary-color);color:var(--text-color-light);transform:translateY(-2px)}
.btn-outline-secondary{color:var(--text-color-medium);border-color:var(--border-color)}
.btn-outline-secondary:hover{background-color:var(--text-color-medium);border-color:var(--text-color-medium);color:var(--light-color);transform:translateY(-2px)}
.sidebar{
  position:sticky;top:1rem;align-self:flex-start;height:calc(100dvh - 2rem);
  width:var(--sidebar-collapsed);padding:18px 0;background:var(--menu-bg)!important;
  box-shadow:0 10px 35px rgba(27,23,255,.2);overflow:hidden auto;border-radius:var(--radius-lg);
  transition:width var(--transition),box-shadow var(--transition);z-index:1030
}
.sidebar:hover{width:var(--sidebar-expanded);box-shadow:var(--shadow-strong)}
.sidebar .logo{width:100%;padding:0 28px;margin:12px 0 28px;max-height:44px;object-fit:contain;filter:brightness(0) invert(1)}
.sidebar .sidebar-heading{
  padding:.55rem 1.5rem .55rem 34px;font-size:.78rem;color:rgba(255,255,255,.78)!important;
  text-transform:uppercase;letter-spacing:1px;margin-top:1rem;white-space:nowrap;opacity:0;
  transition:opacity var(--transition-fast)
}
.sidebar:hover .sidebar-heading{opacity:1;transition-delay:.08s}
.sidebar hr{border-color:rgba(255,255,255,.25)!important;margin:1rem 1.5rem}
.sidebar .nav-link{
  display:flex;align-items:center;color:var(--menu-text)!important;background:transparent!important;
  border:none!important;box-shadow:none!important;outline:none!important;font-size:1rem;padding:14px 18px;
  white-space:nowrap;transition:background-color var(--transition-fast),color var(--transition-fast),margin var(--transition-fast);
  border-radius:var(--radius-md);margin:6px 12px;overflow:visible
}
.sidebar .nav-link i{font-size:1.25rem;min-width:28px;text-align:center;color:inherit!important}
.sidebar .nav-link:hover,.sidebar .nav-link.active{margin-inline:12px;background:var(--menu-hover-bg)!important}
.sidebar .nav-link.active{font-weight:700}
.sidebar .nav-link .link-text{margin-left:22px;color:inherit!important;display:none}
.sidebar:hover .nav-link .link-text{display:inline}
.main-content{
  padding:0 30px;min-height:calc(100dvh - 2rem);display:flex;flex-direction:column;flex-grow:1;min-width:0;gap:1.5rem
}
.app-header{padding-top:8px;margin-bottom:0;display:flex;justify-content:space-between;align-items:center}
.app-header .avatar{
  width:48px;height:48px;border-radius:50%;background:var(--primary-color);color:var(--light-color)!important;
  display:flex!important;align-items:center!important;justify-content:center!important;font-weight:700;font-size:1.1rem;cursor:pointer;
  border:2px solid var(--light-color);box-shadow:0 0 15px rgba(0,0,0,.08);overflow:hidden;text-align:center
}
.main-footer{
  padding:1rem;border-top:none;font-size:.9rem;background:var(--primary-color);color:var(--light-color);text-align:center;
  border-radius:1rem;margin:0 0 30px;margin-top:auto
}
.main-footer a{color:var(--light-color);font-weight:600;text-decoration:underline}
.main-footer a:hover{color:rgba(255,255,255,.85)}
.offcanvas{border:none;border-radius:0 var(--radius-lg) var(--radius-lg) 0;box-shadow:-10px 0 35px rgba(0,0,0,.1);background:#fff}
.offcanvas-header{border-bottom:1px solid var(--border-color);background:#fff}
.offcanvas-header .btn-close{filter:none;opacity:.7}
.offcanvas-body{background:#fff}
.offcanvas-body .avatar{
  background:var(--primary-color);color:var(--light-color)!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:50%;overflow:hidden;text-align:center
}
.account-list .list-group-item{
  background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-md)!important;margin-bottom:.5rem;
  transition:border-color var(--transition-fast),background-color var(--transition-fast);color:var(--text-color-dark)
}
.account-list .list-group-item:hover{border-color:var(--primary-color);background:var(--table-hover-bg)}
.account-list .list-group-item.active{background:var(--primary-color);border-color:var(--primary-color);color:var(--light-color)}
.account-list .list-group-item.active .text-muted{color:rgba(255,255,255,.75)!important}
.offcanvas-body .list-group-item.border-0{color:var(--text-color-dark);border-radius:var(--radius-md);padding:.75rem 1rem}
.offcanvas-body .list-group-item.border-0:hover{background:var(--table-hover-bg)}
.offcanvas-body .form-switch .form-check-input{border-radius:2em}
.content-card,.kpi-card,.summary-card,.report-summary-card,.receipt-card{
  background:var(--card-bg);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);
  transition:transform var(--transition),box-shadow var(--transition);overflow:hidden
}
.kpi-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(27,23,255,.12)}
.kpi-card .card-body{padding:1.5rem}
.kpi-card .card-title{font-size:.85rem;font-weight:500;color:var(--text-color-medium);text-transform:uppercase;letter-spacing:.5px}
.kpi-card .card-text{font-size:2rem;font-weight:600;color:var(--text-color-dark)}
.form-label{font-weight:500;color:var(--text-color-medium);margin-bottom:.5rem;font-size:.9rem}
.form-control,.form-select{
  background:var(--input-bg);border:1px solid var(--border-color);color:var(--text-color-dark);
  padding:.75rem 1rem;height:auto;border-radius:var(--radius-md);box-shadow:none
}
.form-control::placeholder{color:var(--text-color-light-gray);opacity:1}
.form-control:focus,.form-select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(27,23,255,.12);background:var(--input-bg)}
.form-check-input{background:var(--input-bg);border-color:var(--border-color);border-radius:.35em}
.form-check-input:checked{background:var(--primary-color);border-color:var(--primary-color)}
.form-switch .form-check-input{border-radius:2em}
.input-group-text{background:var(--input-bg);border-color:var(--border-color);color:var(--text-color-light-gray);border-radius:var(--radius-md)}
.filter-bar{padding:1rem 1.5rem;border-radius:var(--radius-md)}
.table-custom{
  vertical-align:middle;--bs-table-bg:transparent;--bs-table-border-color:var(--border-color);
  --bs-table-striped-bg:var(--table-striped-bg);--bs-table-hover-bg:var(--table-hover-bg);color:var(--text-color-dark);
  border-collapse:separate;border-spacing:0
}
.table-custom th{
  font-weight:500;padding:.9rem 1.2rem;color:var(--text-color-medium);background:var(--table-header-bg);
  border-bottom:1px solid var(--border-color);white-space:nowrap
}
.table-custom td{padding:.9rem 1.2rem;color:var(--text-color-dark);border-top:1px solid var(--border-color)}
.table-striped>tbody>tr:nth-of-type(odd)>*{--bs-table-accent-bg:var(--table-striped-bg);color:var(--text-color-dark)}
.table-hover>tbody>tr:hover>*{--bs-table-accent-bg:var(--table-hover-bg);color:var(--text-color-dark);transition:background-color var(--transition-fast)}
.pagination{margin-bottom:0}
.pagination .page-link{
  color:var(--primary-color);background:var(--input-bg);border-color:var(--border-color);
  margin:0 2px;border-radius:.5rem;transition:all var(--transition-fast)
}
.pagination .page-item.active .page-link{background:var(--primary-color);border-color:var(--primary-color);color:var(--light-color);z-index:3;box-shadow:0 4px 10px rgba(27,23,255,.2)}
.pagination .page-item.disabled .page-link{color:var(--text-color-medium);background:transparent;border-color:var(--border-color)}
.pagination .page-link:hover{background:var(--table-hover-bg);border-color:var(--primary-color);z-index:2}
.chart-container,.doughnut-container{position:relative;height:320px;width:100%}
body.receipt-page{padding:0!important;background-color:#fff!important;min-height:100dvh}
.receipt-container{max-width:700px;margin:2rem auto}
.receipt-card{
  background:var(--card-bg)!important;border:1px solid var(--border-color)!important;border-radius:var(--radius-sm)!important;
  box-shadow:0 5px 15px rgba(0,0,0,.05);overflow:hidden
}
.receipt-header{padding:2rem;background:var(--table-header-bg);border-bottom:1px solid var(--border-color)}
.receipt-header img{max-height:35px}
.receipt-header h4{color:var(--primary-color);margin:1rem 0 0}
.receipt-body{padding:2rem}
.receipt-field{margin-bottom:1.25rem}
.receipt-field label{
  display:block;font-size:.85rem;color:var(--text-color-medium);margin-bottom:.2rem;text-transform:uppercase;letter-spacing:.5px
}
.receipt-field span{font-weight:500;font-size:1rem;color:var(--text-color-dark);word-break:break-word}
.receipt-value{font-size:2rem;font-weight:700;color:var(--text-color-dark)}
.receipt-authentication{
  margin-top:1.5rem;padding:1rem;background:#fff;border:1px dashed var(--border-color);
  border-radius:var(--radius-sm);text-align:center
}
.receipt-authentication label{color:var(--text-color-medium);font-size:.8rem;margin-bottom:.25rem}
.receipt-authentication code{font-size:1.1rem;color:var(--secondary-color);word-break:break-all}
.receipt-footer{padding:1.5rem;border-top:1px solid var(--border-color);background:var(--table-header-bg);text-align:center}
@media print{
  body.receipt-page{background:#fff!important;padding:0!important}
  .receipt-container{max-width:100%;margin:0}
  .receipt-card{box-shadow:none!important;border:none!important}
  .receipt-footer{display:none!important}
  .receipt-header h4{color:var(--primary-color)!important}
  .receipt-field span,.receipt-authentication code,h1,h2,h3,h4,h5,h6,p,small,strong,div,span,li,dt,dd{color:#000!important;background-color:transparent!important}
}
.login-body{
  height:100dvh;overflow:hidden;padding:0!important;background:#fff!important;background-image:none!important;
  display:grid;place-items:stretch
}
.login-body .main-container{display:flex;width:100%;height:100%}
.login-body .branding-side{
  width:55%;background:var(--primary-color);color:var(--light-color);
  display:flex;flex-direction:column;justify-content:center;align-items:center;padding:4rem;text-align:center
}
.login-body .branding-side .logo{max-width:250px;margin-bottom:2rem;filter:brightness(0) invert(1)}
.login-body .branding-side h1{font-size:2.5rem;font-weight:700;margin-bottom:1rem;color:var(--light-color)}
.login-body .form-side{
  width:45%;background:#fff!important;display:flex;justify-content:center;align-items:center;
  padding:3rem;overflow-y:auto
}
.login-body .form-wrapper{max-width:450px;width:100%}
.login-body .form-wrapper .logo-mobile{max-width:150px;margin-bottom:2rem}
.login-body .form-side .content-card{
  background:#fff;border:1px solid var(--border-color);box-shadow:0 10px 40px rgba(0,0,0,.04);border-radius:1rem;padding:2.5rem!important
}
.login-body .form-wrapper h2{margin-bottom:2rem;color:var(--text-color-dark)}
.login-body .form-check-label{color:var(--text-color-medium);font-size:.9rem}
.login-body a{color:var(--primary-color)!important}
.login-body a:hover{color:var(--primary-color-hover)!important}
.login-body .form-control{background:#fff!important;border:1px solid var(--border-color)!important;color:var(--text-color-dark)!important}
.login-body .form-control:focus{background:#fff!important;border-color:var(--primary-color)!important;box-shadow:0 0 0 3px rgba(27,23,255,.1)!important}
.login-body .input-group-text{background:#fff!important;border:1px solid var(--border-color)!important;color:var(--text-color-medium)!important}
.login-body .form-text{font-size:.8rem;color:var(--text-color-medium)!important;margin-top:.25rem;display:block}
.login-body .btn-primary{color:#fff!important;font-weight:500}
@media (max-width:992px){
  .login-body .branding-side{display:none}
  .login-body .form-side{width:100%}
}
.onboarding-body{display:grid!important;place-items:center!important;min-height:100dvh!important;padding:2rem 1rem!important;background:#fff!important}
.onboarding-wrapper{width:min(920px,100%);margin:0 auto}
.onboarding-logo{max-height:48px;height:auto;margin-bottom:1.25rem}
.onboarding-body .content-card{border-radius:1rem;margin:0 auto}
.wizard-steps{display:flex;align-items:flex-start;margin-bottom:2.5rem}
.wizard-step{flex:1;text-align:center;position:relative;padding:0 .5rem}
.wizard-step .step-circle{
  width:35px;height:35px;border-radius:50%;border:2px solid var(--border-color);background:var(--input-bg);
  color:var(--text-color-medium);display:flex;align-items:center;justify-content:center;margin:0 auto .5rem;font-weight:700;transition:all var(--transition)
}
.wizard-step p{color:var(--text-color-medium);font-weight:500;font-size:.9rem;transition:color var(--transition);margin-bottom:0}
.wizard-step.active .step-circle{background:var(--primary-color);border-color:var(--primary-color);color:var(--light-color)}
.wizard-step.active p{color:var(--text-color-dark);font-weight:600}
.wizard-step:not(:last-child)::after{content:"";position:absolute;top:17px;left:50%;width:calc(100% - 40px);height:2px;background:var(--border-color);transform:translateX(20px);z-index:-1}
.step-navigation{display:flex;gap:.5rem;justify-content:flex-end}
.form-step{display:none}
.form-step.active{display:block}
.partner-card{position:relative;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:1rem;margin-bottom:.75rem;background:var(--card-bg)}
.partner-card .btn-remove-partner{position:absolute;top:.5rem;right:.5rem}
@media (max-width:576px){
  .onboarding-body{padding:1rem!important}
  .onboarding-body .content-card{padding:1.25rem!important}
}
.upload-dropzone-link{position:relative;display:block;text-decoration:none}
.upload-dropzone-link .stretched-link::after{position:absolute;inset:0;z-index:1;content:""}
.upload-dropzone-link .btn{position:relative;z-index:2}
.nav-pills .nav-link{
  color:var(--text-color-medium);background:transparent;border:1px solid var(--border-color);
  transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast);
  border-radius:var(--radius-md);margin:0 .25rem;padding:.6rem 1rem;font-weight:500
}
.nav-pills .nav-link:hover{color:var(--text-color-dark);background:var(--table-hover-bg);border-color:var(--border-color)}
.nav-pills .nav-link:focus,.nav-pills .nav-link:focus-visible{outline:none;box-shadow:0 0 0 .2rem rgba(27,23,255,.15)}
.nav-pills .nav-link.active,.nav-pills .show>.nav-link{color:var(--light-color);background:var(--primary-color);border-color:var(--primary-color);box-shadow:0 4px 15px rgba(27,23,255,.2)}
@media (max-width:991.98px){
  body.has-sidebar .sidebar{width:0;padding:0;border:none;box-shadow:none}
  body.has-sidebar .main-content{margin-left:.5rem;margin-right:.5rem;width:auto}
  .app-header h1{font-size:1.5rem}
}
@media (max-width:768px){
  body{padding:.5rem}
  body.has-sidebar .main-content{padding:10px;margin-left:.5rem;margin-right:.5rem;width:auto}
  .app-header{margin-bottom:0;padding-top:5px}
  .app-header h1{font-size:1.3rem}
  .app-header p{font-size:.8rem}
  .kpi-card .card-text{font-size:1.5rem}
  .content-card,.kpi-card{border-radius:var(--radius-md)}
  .filter-bar{padding:.75rem}
  .table-custom th,.table-custom td{padding:.5rem .7rem;font-size:.8rem}
  .wizard-steps{flex-direction:column;align-items:flex-start}
  .wizard-step{flex:none;width:100%;text-align:left;margin-bottom:1rem}
  .wizard-step .step-circle{margin:0 .8rem 0 0;display:inline-flex;width:30px;height:30px}
  .wizard-step p{display:inline;font-size:.85rem}
  .wizard-step:not(:last-child)::after{display:none}
  .chart-container,.doughnut-container{height:200px}
  .form-control,.form-select,.btn{font-size:.85rem;padding:.5rem .8rem}
  .btn-lg{font-size:.95rem;padding:.6rem 1.2rem}
  .main-footer{margin:0 -10px -10px -10px;margin-top:auto;border-radius:.75rem;font-size:.8rem;padding:.7rem}
}
.content-card,.summary-card,.report-summary-card,.receipt-card{padding:1.25rem}
.content-card .card-body,.summary-card .card-body,.report-summary-card .card-body,.receipt-card .card-body,.kpi-card .card-body{padding:1.25rem}
.chart-container,.doughnut-container{padding:.5rem;height:320px;width:100%}
.content-card h5,.content-card h4,.content-card .card-title{margin-bottom:.75rem}
.content-card .table,.content-card .table-custom{width:100%;display:table}
.table-responsive{display:block;width:100%;overflow-x:auto}
.table-fullbleed{margin-left:-1.25rem;margin-right:-1.25rem}
.table-fullbleed .table,.table-fullbleed .table-custom{width:100%}
.table-custom{width:100%;vertical-align:middle;--bs-table-bg:transparent;--bs-table-border-color:var(--border-color);--bs-table-striped-bg:var(--table-striped-bg);--bs-table-hover-bg:var(--table-hover-bg);color:var(--text-color-dark);border-collapse:separate;border-spacing:0}

/* KANBAN */
.kanban-area{
  position:relative;display:flex;flex-direction:column;border-radius:calc(var(--radius-lg) + .05rem);
  border:1px solid var(--border-color);background:#fff;box-shadow:0 28px 70px rgba(0,0,0,.06);overflow:hidden
}
.kanban-area>header{
  display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding:1rem 1.25rem;border-bottom:1px solid var(--border-color);background:#fff
}
.kanban-area>header .title{display:flex;align-items:center;gap:.6rem;font-weight:900;font-size:1.05rem}
.kanban-area>header .title .dot{width:.7rem;height:.7rem;border-radius:999px;background:var(--primary-color)}
#kanban-wrapper{
  display:flex;width:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;background:#fff
}
#kanban-wrapper::-webkit-scrollbar{height:10px}
#kanban-wrapper::-webkit-scrollbar-thumb{background:rgba(0,0,0,.14);border-radius:999px}
#kanban-wrapper{scrollbar-color:rgba(0,0,0,.14) transparent}
#myKanban{display:flex;gap:1.25rem;padding:1.25rem;min-height:460px}
.kanban-board{
  flex:0 0 clamp(320px,30vw,360px);max-width:clamp(320px,30vw,360px);display:flex;flex-direction:column;scroll-snap-align:start;
  background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-md);overflow:hidden;
  box-shadow:0 12px 28px rgba(0,0,0,.06)
}
.kanban-board[data-status="backlog"]{--accent:var(--kanban-backlog)}
.kanban-board[data-status="todo"]{--accent:var(--kanban-todo)}
.kanban-board[data-status="doing"]{--accent:var(--kanban-doing)}
.kanban-board[data-status="review"]{--accent:var(--kanban-review)}
.kanban-board[data-status="done"]{--accent:var(--kanban-done)}
.kanban-board header{
  position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  padding:.85rem 1rem;background:#fff;border-bottom:1px solid var(--border-color)
}
.kanban-title-board{display:flex;align-items:center;gap:.55rem;font-size:1rem;font-weight:900;color:var(--text-color-dark)}
.kanban-title-dot{
  width:.6rem;height:.6rem;border-radius:999px;background:var(--accent);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 16%, transparent)
}
.kanban-title-count{
  font-size:.72rem;font-weight:900;padding:.16rem .5rem;border-radius:999px;background:color-mix(in srgb,var(--accent) 12%, #fff);
  color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 26%, #fff)
}
.kanban-actions{display:flex;gap:.35rem}
.kanban-actions .btn{padding:.36rem .7rem;border-radius:999px}
.kanban-board main{display:flex;flex-direction:column;gap:1rem;padding:1rem;background:#fff}
.kanban-board footer{margin-top:auto;padding:.8rem 1rem;border-top:1px dashed var(--border-color);background:#fff}
.kanban-add-btn{
  width:100%;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;padding:.6rem .9rem;border-radius:999px;
  background:#fff;border:1px dashed var(--border-color);color:var(--text-color-medium);transition:all var(--transition-fast)
}
.kanban-add-btn:hover{border-color:var(--accent);color:var(--accent);box-shadow:0 8px 22px rgba(0,0,0,.08),0 0 0 2px color-mix(in srgb,var(--accent) 14%, transparent)}
.kanban-item{
  display:flex;flex-direction:column;gap:.6rem;background:#fff;border:1px solid var(--border-color);
  border-radius:calc(var(--radius-md) - .2rem);box-shadow:0 12px 28px rgba(0,0,0,.06);padding:1rem;cursor:grab;
  transition:transform .18s var(--easing),box-shadow .18s var(--easing),border-color .18s var(--easing)
}
.kanban-item:hover{transform:translateY(-2px);box-shadow:0 22px 48px rgba(0,0,0,.10),0 0 0 1px color-mix(in srgb,var(--accent) 18%, transparent);border-color:color-mix(in srgb,var(--accent) 24%, #dfe3ee)}
.kanban-item:active{cursor:grabbing}
.kanban-card-title{font-weight:900;color:var(--text-color-dark);line-height:1.25;font-size:1rem}
.kanban-sub{font-size:.9rem;color:#3f4a5e}
.kanban-meta{display:flex;flex-wrap:wrap;gap:.42rem .55rem;align-items:center}
.kanban-badge{font-size:.72rem;font-weight:900;padding:.18rem .5rem;border-radius:.6rem;background:#f4f6ff;color:#3a4760;border:1px solid #e8ecf7}
.badge-success{background:rgba(25,135,84,.12);color:var(--success-color)}
.badge-warning{background:rgba(255,193,7,.15);color:#9a7a00}
.badge-danger{background:rgba(220,53,69,.12);color:var(--danger-color)}
.badge-info{background:rgba(13,202,240,.15);color:#087991}
.kanban-tags{display:flex;gap:.4rem;flex-wrap:wrap}
.tag{
  display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:900;padding:.22rem .58rem;border-radius:.7rem;
  background:color-mix(in srgb,var(--accent) 10%, #fff);color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 24%, #fff)
}
.kanban-assignees{display:flex;align-items:center;gap:.25rem;margin-left:auto}
.avatar{width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#f4f6ff;color:#2b2b2b;font-size:.75rem;font-weight:800;border:2px solid #fff;box-shadow:0 1px 0 rgba(0,0,0,.06)}
.avatar-stack{display:flex}
.avatar-stack .avatar{margin-left:-8px}
.kanban-progress{height:6px;border-radius:999px;background:#eef0ff;overflow:hidden}
.kanban-progress>span{display:block;height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 60%, #cfd7ff));transition:width var(--transition)}
.kanban-item[data-progress="0"] .kanban-progress>span{width:0%}
.kanban-item[data-progress="25"] .kanban-progress>span{width:25%}
.kanban-item[data-progress="50"] .kanban-progress>span{width:50%}
.kanban-item[data-progress="75"] .kanban-progress>span{width:75%}
.kanban-item[data-progress="100"] .kanban-progress>span{width:100%}
.kanban-due{margin-left:auto;font-size:.76rem;font-weight:900;padding:.18rem .5rem;border-radius:.55rem;background:#f6f8ff;color:#5c5c5c;border:1px solid #e8ecf7}
.kanban-due.over{background:rgba(220,53,69,.12);color:var(--danger-color);border-color:rgba(220,53,69,.32)}
.kanban-priority{font-size:.72rem;font-weight:900;padding:.18rem .5rem;border-radius:.55rem}
.prio-low{background:rgba(0,179,164,.12);color:#008a7f}
.prio-med{background:rgba(255,193,7,.15);color:#8f6a00}
.prio-high{background:rgba(220,53,69,.12);color:#b21e32}
.gu-mirror{opacity:.96;transform:rotate(.4deg) translateY(-2px);cursor:grabbing;box-shadow:0 26px 72px rgba(0,0,0,.18)}
.gu-transit{opacity:.45}
.kanban-placeholder{border:2px dashed color-mix(in srgb,var(--accent) 38%, #9aa5ff);border-radius:calc(var(--radius-md) - .2rem);min-height:64px;background:color-mix(in srgb,var(--accent) 8%, #fff)}
.kanban-empty{display:flex;align-items:center;justify-content:center;min-height:90px;color:var(--text-color-light-gray);font-size:.9rem}
.kanban-wip{margin-left:auto;font-size:.72rem;font-weight:900;padding:.18rem .5rem;border-radius:.55rem;background:#f3f6ff;color:#6b6b6b;border:1px solid #e8ecf7}
.kanban-board[data-over-wip="true"] header{background:linear-gradient(180deg,rgba(255,235,59,.12),#fff)}
.kanban-board.is-loading main{filter:grayscale(.2);opacity:.6}
.kanban-board.success header{border-bottom-color:rgba(25,135,84,.45)}
.kanban-board.warning header{border-bottom-color:rgba(255,193,7,.6)}
.kanban-board.danger header{border-bottom-color:rgba(220,53,69,.45)}
@media (max-width:768px){
  #myKanban{padding:1rem}
  .kanban-board{flex:0 0 88vw;max-width:88vw}
  .kanban-item{padding:.95rem}
}

/* =============================================================================
   QUILLJS EDITOR (Orçamentos Form) — Correções
   - Mantém visual alinhado aos inputs do sistema
   - Altura fluida, sem barras de rolagem desnecessárias
   - Placeholder estável
   - Estados de foco/erro/disabled prontos
============================================================================= */

/* ---------- Fallbacks para tokens (se não existirem) ---------- */
:root{
  --border-color: #dee2e6;
  --radius-md: 0.5rem;
  --input-bg: #ffffff;
  --text-color-dark: #212529;
  --text-color-light-gray: #adb5bd;
  --table-header-bg: #f8f9fa;
  --focus-ring: 0 0 0 3px rgba(21, 18, 214, .12);
  --error-color: #dc3545;
}

/* ---------- Container principal (envolve toolbar + editor) ---------- */
#editor-container{
  display: flex;
  flex-direction: column;         /* toolbar em cima, editor embaixo */
  gap: 0;                         /* sem espaçamentos entre toolbar e editor */
  min-height: 350px !important;              /* altura mínima desejada */
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background-color: var(--input-bg);
  font: inherit;
  color: var(--text-color-dark);
  line-height: 1.5;
  overflow: hidden;               /* evita “vazar” raio da borda */
}

/* ---------- Toolbar (dentro do container) ---------- */
#editor-container .ql-toolbar.ql-snow{
  border: none;
  border-bottom: 1px solid var(--border-color);
  background-color: var(--table-header-bg);
  padding: 8px;
  border-top-left-radius: var(--radius-md);
  border-top-right-radius: var(--radius-md);
  /* NÃO usar order aqui. A estrutura ideal é toolbar como 1º filho no container */
}

/* ---------- Editor (área de texto) ---------- */
#editor-container .ql-container.ql-snow{
  border: none;
  flex: 1 1 auto;                 /* ocupa o restante do container */
  min-height: 0;                  /* permite o flex encolher sem “explodir” */
  overflow: auto;                 /* rolagem quando necessário */
  border-bottom-left-radius: var(--radius-md);
  border-bottom-right-radius: var(--radius-md);
  background-color: var(--input-bg);
}

/* Conteúdo do editor */
#editor-container .ql-editor{
  position: relative;             /* necessário para o placeholder absoluto */
  padding: 1rem;
  /* Não force height:100%; deixa o conteúdo crescer naturalmente */
  min-height: 220px;              /* garante área confortável para digitação */
  box-sizing: border-box;
}

/* ---------- Placeholder estável ---------- */
#editor-container .ql-editor.ql-blank::before{
  content: attr(data-placeholder);
  position: absolute;
  left: 1rem;
  right: 1rem;
  top: 1rem;
  color: var(--text-color-light-gray);
  pointer-events: none;
  font-style: normal;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

/* ---------- Estado de foco (quando o usuário clica) ---------- */
#editor-container:focus-within{
  box-shadow: var(--focus-ring);
  outline: none;
  border-color: rgba(21,18,214,.45);
}

/* ---------- Estado “disabled” (opcional) ---------- */
#editor-container.is-disabled,
#editor-container[aria-disabled="true"]{
  opacity: .7;
  pointer-events: none;
}

/* ---------- Estado de erro (opcional) ---------- */
#editor-container.is-invalid{
  border-color: var(--error-color);
  box-shadow: 0 0 0 2px rgba(220,53,69,.08);
}

/* ---------- Caso a toolbar esteja FORA do container ----------
   Estrutura comum do Quill: <div id="toolbar"></div><div id="editor-container">...</div>
   Esses estilos garantem que ainda fique coeso visualmente. */
#toolbar.ql-toolbar.ql-snow{
  border: 1px solid var(--border-color);
  border-bottom: none;
  border-top-left-radius: var(--radius-md);
  border-top-right-radius: var(--radius-md);
  background-color: var(--table-header-bg);
  padding: 8px;
}
#toolbar + #editor-container{
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/* ---------- Ajustes finos de botões/menus da toolbar ---------- */
.ql-snow .ql-picker,
.ql-snow .ql-formats{
  margin-right: 6px;
}
.ql-snow .ql-stroke{
  stroke: currentColor;
}
.ql-snow .ql-fill{
  fill: currentColor;
}

/* ---------- Dark mode (se o site usar data-bs-theme="dark" ou classe .dark) ---------- */
[data-bs-theme="dark"] #editor-container,
.dark #editor-container{
  --input-bg: #1e1e1e;
  --text-color-dark: #e8e8e8;
  --table-header-bg: #2a2a2a;
  --border-color: #3a3a3a;
}
