:root {
  /* Cores oficiais da marca Solusat (extraídas de solusat.com.br) */
  --solusat-dark: #152846;
  --solusat-dark-2: #0d1b2e;
  --solusat-orange: #f05600;
  --solusat-orange-2: #ff7f2e;
  --solusat-slate: #3a4856;
  --solusat-green: #2db742;
  --solusat-blue: #2d5f8a;
  --solusat-gray: #f3f5f7;
  --solusat-border: #e2e6ec;
  --shadow-sm: 0 1px 3px rgba(15, 35, 60, .06);
  --shadow-md: 0 6px 20px rgba(15, 35, 60, .10);
  --shadow-lg: 0 12px 32px rgba(15, 35, 60, .16);
}

* { box-sizing: border-box; }

body {
  background: var(--solusat-gray);
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  color: #1c2733;
  -webkit-tap-highlight-color: transparent;
}

a { transition: color .15s ease, background-color .15s ease, box-shadow .15s ease, transform .1s ease; }

body.auth-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--solusat-dark), var(--solusat-dark-2));
}

/* ---- Shell / sidebar ---- */
.app-shell { display: flex; min-height: 100vh; }

.sidebar {
  width: 250px;
  background: linear-gradient(180deg, var(--solusat-dark), var(--solusat-dark-2));
  color: #fff;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0; bottom: 0; left: 0;
  z-index: 1030;
  transition: transform .25s ease;
  box-shadow: var(--shadow-lg);
}

.sidebar-brand {
  display: flex; flex-direction: column; align-items: center; gap: .6rem;
  padding: 1.25rem 1rem; border-bottom: 1px solid rgba(255,255,255,.1);
}
.sidebar-logo {
  height: 46px; background: #fff; border-radius: .6rem; padding: .5rem .75rem;
  box-shadow: var(--shadow-sm);
}
.sidebar-brand small { display: block; opacity: .75; font-size: .7rem; letter-spacing: .03em; text-transform: uppercase; }

.sidebar-nav { flex: 1; overflow-y: auto; padding: .75rem .6rem; }
.sidebar-nav a {
  display: flex; align-items: center; gap: .65rem;
  padding: .65rem .9rem; color: rgba(255,255,255,.85); text-decoration: none; font-size: .92rem;
  border-radius: .5rem; margin-bottom: .15rem;
}
.sidebar-nav a:hover { background: rgba(255,255,255,.08); color: #fff; }
.sidebar-nav a.active { background: var(--solusat-orange); color: #fff; box-shadow: var(--shadow-sm); }
.sidebar-nav i { width: 18px; text-align: center; }

.sidebar-footer { padding: 1rem; border-top: 1px solid rgba(255,255,255,.1); }
.user-chip { display: flex; align-items: center; gap: .5rem; font-size: .9rem; }

.main-content { margin-left: 250px; flex: 1; min-width: 0; display: flex; flex-direction: column; }

.topbar { background: #fff; border-bottom: 1px solid var(--solusat-border); padding: .9rem 1.5rem; display: flex; align-items: center; gap: 1rem; position: sticky; top: 0; z-index: 1020; box-shadow: var(--shadow-sm); }
.topbar-title { font-size: 1.15rem; font-weight: 600; margin: 0; color: var(--solusat-dark); }

.content-area { padding: 1.5rem; flex: 1; }

@media (max-width: 991px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .main-content { margin-left: 0; }
}

/* ---- Navegação inferior (mobile, papel de prestador/técnico) ---- */
.bottom-nav {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1040;
  background: #fff;
  border-top: 1px solid var(--solusat-border);
  box-shadow: 0 -6px 20px rgba(15,35,60,.08);
  padding-bottom: env(safe-area-inset-bottom);
}
.bottom-nav-inner { display: flex; }
.bottom-nav a {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: .2rem;
  padding: .55rem 0 .5rem; color: #7a8797; text-decoration: none; font-size: .68rem; font-weight: 600;
}
.bottom-nav a i { font-size: 1.15rem; }
.bottom-nav a.active { color: var(--solusat-dark); }
.bottom-nav a.active i { color: var(--solusat-orange); }

body.role-provider.has-sidebar .content-area { padding-bottom: 5.5rem; }

@media (max-width: 767px) {
  body.role-provider .bottom-nav { display: block; }
  body.role-provider .sidebar { display: none; }
  body.role-provider .main-content { margin-left: 0; }
  body.role-provider .topbar { position: sticky; }
}

/* ---- Cards / componentes ---- */
.card { border: 1px solid var(--solusat-border); border-radius: .8rem; box-shadow: var(--shadow-sm); }
.card-header { background: #fbfcfe; border-bottom: 1px solid var(--solusat-border); border-radius: .8rem .8rem 0 0 !important; font-weight: 600; }
.stat-card { border-radius: 1rem; padding: 1.25rem; color: #fff; box-shadow: var(--shadow-md); position: relative; overflow: hidden; }
.stat-card::after { content: ''; position: absolute; right: -20px; top: -20px; width: 90px; height: 90px; border-radius: 50%; background: rgba(255,255,255,.08); }
.stat-card h3 { font-size: 1.9rem; margin: 0; font-weight: 700; }
.stat-card small { opacity: .9; letter-spacing: .04em; }
.bg-solusat-dark { background: linear-gradient(135deg, var(--solusat-dark), var(--solusat-dark-2)); }
.bg-solusat-blue { background: linear-gradient(135deg, var(--solusat-slate), #56697c); }
.bg-solusat-orange { background: linear-gradient(135deg, var(--solusat-orange), var(--solusat-orange-2)); }
.bg-solusat-green { background: linear-gradient(135deg, var(--solusat-green), #58d16d); }

.opportunity-card { border-left: 4px solid var(--solusat-orange); transition: transform .15s ease, box-shadow .15s ease; }
.opportunity-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.badge-status { font-size: .72rem; padding: .35em .6em; }

.btn { border-radius: .5rem; font-weight: 500; }
.btn-solusat { background: var(--solusat-orange); border-color: var(--solusat-orange); color: #fff; }
.btn-solusat:hover { background: var(--solusat-dark); border-color: var(--solusat-dark); color: #fff; }
.btn-solusat:active { transform: scale(.98); }
.text-orange { color: var(--solusat-orange); }

.btn-check:checked + .btn-outline-secondary {
  background: var(--solusat-dark); border-color: var(--solusat-dark); color: #fff;
}

/* ---- Painel resumo (formulário de OS) ---- */
.summary-panel { position: sticky; top: 5.5rem; }
.summary-row {
  display: flex; justify-content: space-between; align-items: baseline; gap: .5rem;
  padding: .4rem 0; font-size: .85rem; border-bottom: 1px dashed var(--solusat-border);
}
.summary-row:last-of-type { border-bottom: none; }
.summary-label { color: #6b7787; }
.summary-label i { width: 16px; text-align: center; margin-right: .3rem; }

.rule-toggle {
  display: flex; align-items: center; gap: .5rem; padding: .6rem .75rem;
  border: 1px solid var(--solusat-border); border-radius: .5rem; cursor: pointer;
  font-size: .85rem; transition: all .15s ease; margin: 0;
}
.rule-toggle:has(input:checked) { background: #fff4ec; border-color: var(--solusat-orange); color: var(--solusat-dark); }
.rule-toggle input { margin-right: .1rem; }

canvas.signature-pad { border: 2px dashed var(--solusat-border); border-radius: .5rem; touch-action: none; width: 100%; height: 220px; background: #fff; display: block; }

.photo-thumb { width: 90px; height: 90px; object-fit: cover; border-radius: .5rem; border: 1px solid var(--solusat-border); box-shadow: var(--shadow-sm); }

.timeline { list-style: none; padding-left: 0; }
.timeline li { padding: .5rem 0 .5rem 1.5rem; border-left: 2px solid var(--solusat-border); position: relative; }
.timeline li::before { content: ''; position: absolute; left: -6px; top: .8rem; width: 10px; height: 10px; border-radius: 50%; background: var(--solusat-orange); }

/* ---- Kanban ---- */
.kanban-board { display: flex; gap: 1rem; overflow-x: auto; padding-bottom: 1rem; -webkit-overflow-scrolling: touch; }
.kanban-column { flex: 0 0 270px; background: #eef1f6; border-radius: .8rem; display: flex; flex-direction: column; max-height: calc(100vh - 220px); }
.kanban-column-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: .7rem .9rem; font-weight: 600; font-size: .85rem; border-radius: .8rem .8rem 0 0;
  position: sticky; top: 0;
}
.kanban-count { background: rgba(0,0,0,.12); border-radius: 1rem; padding: .1rem .55rem; font-size: .75rem; }
.kanban-column-body { padding: .6rem; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: .6rem; }
.kanban-card {
  display: block; background: #fff; border-radius: .6rem; padding: .75rem .85rem;
  box-shadow: var(--shadow-sm); text-decoration: none; color: inherit;
  border-left: 3px solid var(--solusat-orange); transition: transform .12s ease, box-shadow .12s ease;
}
.kanban-card:hover { transform: translateY(-2px) scale(1.01); box-shadow: var(--shadow-md); color: inherit; }
.kanban-card-top { display: flex; justify-content: space-between; font-size: .82rem; margin-bottom: .3rem; }
.kanban-card-top strong { color: var(--solusat-dark); }
.kanban-card-value, .kanban-value { color: var(--solusat-green); font-weight: 700; font-size: .82rem; }
.kanban-card-service { font-weight: 600; font-size: .88rem; margin-bottom: .35rem; }
.kanban-card-meta { font-size: .76rem; color: #6b7787; margin-bottom: .15rem; }
.kanban-empty { text-align: center; color: #9aa5b3; font-size: .8rem; padding: 1rem 0; }

/* ---- Barra de ações fixa (execução mobile) ---- */
.sticky-action-bar {
  position: sticky; bottom: 0; left: 0; right: 0;
  background: #fff; padding: .75rem 1.5rem; margin: 1rem -1.5rem 0;
  box-shadow: 0 -6px 20px rgba(15,35,60,.1);
  z-index: 10;
}
body.role-provider .sticky-action-bar { margin-bottom: -1.5rem; }
@media (max-width: 767px) {
  .sticky-action-bar { bottom: 4.25rem; }
}

/* ---- Stepper de status da OS ---- */
.os-stepper { display: flex; overflow-x: auto; padding: .5rem 0; gap: 0; }
.os-step { flex: 1; min-width: 100px; text-align: center; position: relative; }
.os-step::before {
  content: ''; position: absolute; top: 15px; left: -50%; width: 100%; height: 3px;
  background: var(--solusat-border); z-index: 0;
}
.os-step:first-child::before { display: none; }
.os-step.done::before, .os-step.active::before { background: var(--solusat-orange); }
.os-step-dot {
  width: 32px; height: 32px; border-radius: 50%; background: #fff; border: 3px solid var(--solusat-border);
  display: flex; align-items: center; justify-content: center; margin: 0 auto .4rem; position: relative; z-index: 1;
  font-size: .8rem; font-weight: 700; color: #9aa5b3;
}
.os-step.done .os-step-dot { background: var(--solusat-orange); border-color: var(--solusat-orange); color: #fff; }
.os-step.active .os-step-dot { border-color: var(--solusat-orange); color: var(--solusat-orange); box-shadow: 0 0 0 4px rgba(240,86,0,.15); }
.os-step-label { font-size: .75rem; color: #6b7787; font-weight: 600; }
.os-step.active .os-step-label, .os-step.done .os-step-label { color: var(--solusat-dark); }

/* ---- Linhas de informação (detalhe da OS) ---- */
.info-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; color: #8b95a3; margin-bottom: .15rem; }
.info-label i { width: 16px; text-align: center; margin-right: .3rem; color: var(--solusat-orange); }
.info-value { font-size: .95rem; color: #1c2733; }

/* ---- Compartilhamento ---- */
.nav-tabs-sm .nav-link { font-size: .82rem; padding: .4rem .8rem; }
.share-provider-list { max-height: 180px; overflow-y: auto; display: flex; flex-direction: column; gap: .25rem; }
.share-provider-item {
  display: block; padding: .4rem .6rem; border-radius: .4rem; font-size: .82rem;
  color: #333; text-decoration: none; border: 1px solid transparent;
}
.share-provider-item:hover { background: #f3f5f7; border-color: var(--solusat-border); }