/* Ajustes do painel sobre o Sash. O tema em si vem de assets/css/styles.min.css. */

/* Logo em texto no lugar das imagens do Sash (que são a marca deles). */
.brand-text {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: rgb(var(--primary-rgb));
  text-decoration: none;
}
.brand-text i { font-size: 1.5rem; }
.main-sidebar-header .header-logo.brand-text { justify-content: center; }
/* Menu recolhido: sobra só o ícone. */
[data-toggled="icon-overlay-close"] .app-sidebar:not(:hover) .brand-label,
[data-toggled="icon-text-close"] .app-sidebar .brand-label,
[data-toggled="menu-click-closed"] .app-sidebar .brand-label,
[data-toggled="menu-hover-closed"] .app-sidebar .brand-label,
[data-toggled="icon-click-closed"] .app-sidebar .brand-label,
[data-toggled="icon-hover-closed"] .app-sidebar .brand-label { display: none; }

.min-w-0 { min-width: 0; }
.card-header[role="button"] { cursor: pointer; user-select: none; }

/* Reservas: cabeçalho da linha em grade, que quebra bem no celular. */
.abb-bk-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: .75rem;
  cursor: pointer;
  margin: -.75rem -1.25rem;
  padding: .75rem 1.25rem;
  transition: background .15s;
}
/* A linha inteira abre os detalhes: o fundo no hover e a seta dizem isso. */
.abb-bk-head:hover { background: rgba(var(--primary-rgb), .05); }
.abb-bk-chev {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(var(--primary-rgb), .08); color: rgb(var(--primary-rgb));
  font-size: 1rem;
}
.abb-bk-head:hover .abb-bk-chev { background: rgba(var(--primary-rgb), .16); }
.abb-detail { margin-top: 1.25rem !important; }
.fs-11 { font-size: .7rem; }
.abb-bk-status { min-width: 5.5rem; text-align: right; }
.abb-bk-off .abb-bk-main { opacity: .55; text-decoration: line-through; }
/* Reserva que já saiu: só a linha fica apagada; aberta, o detalhe lê-se normal. */
.abb-bk-past .abb-bk-head { opacity: .55; }
@media (max-width: 575.98px) {
  .abb-bk-head { grid-template-columns: minmax(0, 1fr) auto auto; }
  .abb-bk-status { grid-column: 1 / -1; grid-row: 2; text-align: left; min-width: 0; }
  .abb-bk-status:empty { display: none; }
}

/* Inventário */
.abb-thumb {
  width: 44px;
  height: 44px;
  border-radius: .5rem;
  object-fit: cover;
  flex-shrink: 0;
}
.abb-thumb-empty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgb(var(--light-rgb));
  color: var(--text-muted);
}
.abb-photo-box {
  width: 120px;
  height: 120px;
  border-radius: .5rem;
  border: 1px dashed var(--default-border);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.abb-photo-box img { width: 100%; height: 100%; object-fit: cover; }

/* Login */
.login-bg { min-height: 100vh; }

/* O Sash capitaliza todo título de card; em português isso vira "Quanto Sobra". */
.card-title { text-transform: none; }

@media (max-width: 575.98px) {
  .stat-value { font-size: 1.1rem; }
  .card.custom-card .card-body { padding: 1rem; }
}

/* ---------- Parceiro (Calendário e Financeiro) ----------
   Mobile first: o parceiro abre isto no celular quase sempre. O estilo base é
   o do celular; as media queries de min-width só alargam para o computador. */
.pt-page { max-width: 680px; margin: 0 auto; padding: 12px 0 24px; }
.pt-title { font-size: 1.35rem; font-weight: 700; margin: 0 0 12px; color: #222; }
.pt-hint { text-align: center; color: #8a8f98; font-size: .8rem; margin: 8px 0 0; }

/* Próxima limpeza: o card escuro do topo, a resposta que ele abre o app para ver. */
.pt-next { background: #222; color: #fff; border-radius: 18px; padding: 16px 18px; margin-bottom: 12px; }
.pt-next-label { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.pt-next-day { font-size: 1.45rem; font-weight: 700; margin: 2px 0 4px; }
.pt-next-sub { font-size: .88rem; opacity: .85; }
.pt-next .pt-chip-warn { margin: 10px 0 0; }
.pt-next-wc { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 12px; padding: 12px; border-radius: 12px; background: #fff; color: #222; font-weight: 600; font-size: .92rem; text-decoration: none; }
.pt-next-wc:hover { color: #222; background: #f1f1f1; }

/* Avisos de troca no mesmo dia. */
.pt-alert {
  display: flex; gap: 10px; align-items: flex-start;
  background: #fff4e0; color: #7a4d00;
  border-radius: 14px; padding: 12px 14px; margin-bottom: 12px; font-size: .88rem;
}
.pt-alert > i { font-size: 1.1rem; margin-top: 1px; }
.pt-alert-sub { font-size: .8rem; opacity: .8; margin-top: 2px; }
.pt-chip-warn {
  display: flex; gap: 6px; align-items: flex-start;
  background: #fff4e0; color: #7a4d00;
  border-radius: 10px; padding: 6px 10px; margin: 8px 0 4px; font-size: .8rem; font-weight: 600;
}
.pt-chip-warn i { margin-top: 2px; }

/* Financeiro: o total no Pix em destaque, dividido em ganho e reembolso. */
.pt-total { background: #fff; border-radius: 18px; padding: 16px 18px; margin-bottom: 12px; box-shadow: 0 1px 3px rgba(0, 0, 0, .06); }
.pt-total-label { color: #6b7280; font-size: .85rem; }
.pt-total-value { font-size: 1.9rem; font-weight: 700; color: #222; line-height: 1.2; white-space: nowrap; }
.pt-total-split { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.pt-total-split > div { background: #f6f7f9; border-radius: 12px; padding: 8px 10px; }
.pt-total-split span { display: block; color: #6b7280; font-size: .75rem; }
.pt-total-split strong { font-size: 1rem; white-space: nowrap; }
.pt-total-paid { margin-top: 10px; color: #6b7280; font-size: .82rem; }
.pt-total-paid strong { color: #222; }

.pt-section {
  display: flex; align-items: center; gap: 8px; width: 100%;
  font-size: 1rem; font-weight: 700; color: #222;
  margin: 18px 0 8px; padding: 0; border: 0; background: none; text-align: left;
}
.pt-section span { color: #8a8f98; font-weight: 500; font-size: .85rem; }
.pt-empty { color: #8a8f98; font-size: .9rem; padding: 4px 0; }

.pt-card { background: #fff; border-radius: 16px; padding: 14px 16px; margin-bottom: 10px; box-shadow: 0 1px 3px rgba(0, 0, 0, .06); }
.pt-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.pt-card-title { font-weight: 700; font-size: 1rem; color: #222; }
.pt-card-sub { color: #6b7280; font-size: .8rem; margin-top: 2px; }
.pt-paid { flex-shrink: 0; display: inline-flex; gap: 4px; align-items: center; background: #e6f6ee; color: #137a48; border-radius: 999px; padding: 2px 8px; font-size: .75rem; font-weight: 600; }

/* O recibo: largura toda, valores alinhados à direita, totais em destaque. */
.pt-receipt { background: #f6f7f9; border-radius: 12px; padding: 10px 12px; margin-top: 10px; font-size: .88rem; }
.pt-r { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; color: #4b5563; }
.pt-r span:last-child { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pt-r-sum, .pt-r-pix { color: #222; font-weight: 700; border-top: 1px solid #e3e5e8; margin-top: 3px; padding-top: 5px; }
.pt-r-pix { font-size: 1rem; }
.pt-r-note { color: #8a8f98; font-size: .8rem; }
.pt-laundry-edit { display: flex; align-items: center; gap: 6px; width: 100%; margin-top: 6px; padding: 10px 4px; border: 0; background: none; color: #5b5ce2; font-size: .88rem; font-weight: 600; text-align: left; }
.pt-card .btn { border-radius: 12px; padding: 10px; font-weight: 600; }

/* Checklist: um card por seção, um item por linha, texto sempre inteiro.
   Marcando, cada linha é um alvo de toque inteiro com uma caixa grande; na
   edição a bolinha cheia é obrigação e a vazada é preferência. */
.ck-sub { color: #6b7280; font-size: .85rem; margin: 4px 0 0; }

.ck-head { background: #222; color: #fff; border-radius: 18px; padding: 12px 10px 14px; margin-bottom: 4px; }
.ck-nav { display: flex; align-items: center; gap: 6px; }
.ck-nav-mid { flex: 1; min-width: 0; text-align: center; }
.ck-nav-label { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.ck-nav-day { font-size: 1.3rem; font-weight: 700; line-height: 1.25; }
.ck-nav-sub { font-size: .85rem; opacity: .85; }
.ck-nav-btn { flex-shrink: 0; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; font-size: 1.2rem; }
.ck-nav-btn:disabled { opacity: .25; }
.ck-progress { height: 8px; border-radius: 999px; background: rgba(255, 255, 255, .18); margin: 12px 8px 6px; overflow: hidden; }
.ck-progress span { display: block; height: 100%; border-radius: 999px; background: #22c55e; transition: width .25s ease; }
.ck-progress-txt { text-align: center; font-size: .85rem; font-weight: 600; }
.ck-progress-txt i { color: #4ade80; }

.ck-card { padding: 2px 0; }
.ck-item { display: flex; align-items: center; gap: 14px; padding: 14px 16px; font-size: .95rem; color: #222; line-height: 1.4; -webkit-tap-highlight-color: transparent; user-select: none; }
.ck-item + .ck-item { border-top: 1px solid #f0f1f3; }
.ck-tap { cursor: pointer; }
.ck-tap:active { background: #fafafa; }
.ck-text { flex: 1; min-width: 0; overflow-wrap: anywhere; transition: color .15s; }
.ck-tag { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 999px; background: #f1f2f4; color: #6b7280; font-size: .7rem; font-weight: 600; vertical-align: 1px; }

/* A caixa: 30px, cantos redondos, verde cheio com o visto quando marcada. */
.ck-box {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 9px; border: 2px solid #c9cdd3; background: #fff;
  color: transparent; font-size: 1.1rem; transition: background .15s, border-color .15s, transform .15s;
}
.ck-on .ck-box { background: #22c55e; border-color: #22c55e; color: #fff; transform: scale(1.06); }
.ck-on .ck-text { color: #9aa0a8; text-decoration: line-through; text-decoration-color: #c9cdd3; }

.ck-dot { flex-shrink: 0; width: 10px; height: 10px; border-radius: 50%; }
.ck-must { background: #222; }
.ck-pref { border: 2px solid #8a8f98; }
.ck-moves { flex-shrink: 0; display: flex; flex-direction: column; margin: -10px -8px -10px 0; }
.ck-move { border: 0; background: none; color: #8a8f98; padding: 4px 8px; line-height: 1; }
.ck-move:disabled { opacity: .25; }

/* Foto do item: miniatura à direita, grande o bastante para o polegar. */
.ck-pic { position: relative; flex-shrink: 0; width: 48px; height: 48px; margin: -6px -4px -6px 0; padding: 0; border: 0; border-radius: 10px; background: #f1f2f4; overflow: hidden; }
.ck-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ck-pic-empty { width: 40px; height: 40px; background: none; color: #c3c7cd; font-size: 1.1rem; }
.ck-pic-n { position: absolute; right: 3px; bottom: 3px; min-width: 18px; padding: 0 4px; border-radius: 999px; background: rgba(0, 0, 0, .65); color: #fff; font-size: .7rem; font-weight: 700; line-height: 18px; }
.ck-ph-list { max-width: 900px; margin: 0 auto; }
.ck-ph { position: relative; margin: 0 0 12px; }
.ck-ph img { display: block; width: 100%; height: auto; border-radius: 12px; background: #f1f2f4; }
.ck-ph-del { position: absolute; top: 8px; right: 8px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .55); color: #fff; font-size: 1.05rem; }
.ck-ph-status { color: #6b7280; font-size: .9rem; text-align: center; margin: 8px 0 12px; }

/* Mercado: o campo de adicionar no topo, e o lápis de editar em cada item. */
.mk-add { display: flex; gap: 8px; margin-bottom: 4px; }
.mk-add .form-control { height: 48px; font-size: 1rem; }
.mk-add .btn { width: 48px; flex-shrink: 0; font-size: 1.2rem; }
.mk-edit { flex-shrink: 0; border: 0; background: none; color: #9aa0a8; padding: 8px; margin: -8px -8px -8px 0; font-size: 1.1rem; }

/* Calendário: no formato do Airbnb. Cada semana é a grade dos dias com uma
   segunda grade por cima, de 14 meias-colunas, onde moram as barras. */
.cal-month { background: #fff; border-radius: 18px; padding: 14px 10px 8px; margin-bottom: 12px; box-shadow: 0 1px 3px rgba(0, 0, 0, .06); }
.cal-month-title { font-size: 1.1rem; font-weight: 700; color: #222; margin: 0 4px 10px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.cal-head { color: #8a8f98; font-size: .72rem; text-align: center; margin-bottom: 4px; }
.cal-week { position: relative; margin-bottom: 3px; }
.cal-day { position: relative; min-height: 58px; border: 1px solid #ebedf0; border-radius: 10px; padding: 4px; }
.cal-empty { border-color: transparent; }
.cal-num { font-weight: 600; font-size: .82rem; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; }
.cal-today { background: #e31c5f; color: #fff; }
.cal-pastday { background: #f6f7f9; border-color: #f6f7f9; }
.cal-pastday .cal-num { color: #a0a4ab; text-decoration: line-through; }
.cal-bars {
  position: absolute; left: 0; right: 0; top: 29px;
  display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); column-gap: 2px;
  pointer-events: none;
}
.cal-bar {
  grid-row: 1; pointer-events: auto;
  display: flex; align-items: center; gap: 6px;
  min-width: 0; height: 24px; padding: 0 5px;
  border: 0; background: #222; color: #fff;
  font-size: .7rem; font-weight: 600; text-align: left; overflow: hidden;
}
.cal-bar:active, .cal-bar:hover { background: #000; }
.cal-start { border-top-left-radius: 12px; border-bottom-left-radius: 12px; }
.cal-end { border-top-right-radius: 12px; border-bottom-right-radius: 12px; }
.cal-avatar { display: none; }
/* Troca no mesmo dia: o dia fica laranja para a limpeza ser planejada. */
.cal-turn { border-color: #f5b324; background: #fff4e0; }
.cal-turn-icon { position: absolute; top: 4px; right: 4px; color: #d68a00; font-size: .78rem; }

@media (min-width: 768px) {
  .pt-page { padding-top: 20px; }
  .pt-title { font-size: 1.6rem; }
  .cal-month { padding: 20px 18px 12px; }
  .cal-month-title { font-size: 1.35rem; }
  .cal-grid { gap: 6px; }
  .cal-week { margin-bottom: 6px; }
  .cal-day { min-height: 80px; padding: 8px 10px; border-radius: 14px; }
  .cal-num { font-size: .9rem; width: 26px; height: 26px; }
  .cal-bars { top: 40px; column-gap: 3px; }
  .cal-bar { height: 30px; font-size: .82rem; padding: 0 8px; }
  .cal-start { border-top-left-radius: 15px; border-bottom-left-radius: 15px; padding-left: 3px; }
  .cal-end { border-top-right-radius: 15px; border-bottom-right-radius: 15px; }
  .cal-avatar {
    flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; border-radius: 50%; background: #fff; color: #222; font-size: .75rem;
  }
  .cal-turn-icon { top: 10px; right: 10px; font-size: 1rem; }
}

/* Abas de baixo: só no login do parceiro e só no celular. Com duas telas, abrir
   o menu lateral para trocar é um passo a mais em toda visita. */
.pt-tabs { display: none; }
@media (max-width: 991.98px) {
  html.is-partner .pt-tabs {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1050;
    background: #fff; border-top: 1px solid #ebedf0;
    padding-bottom: env(safe-area-inset-bottom);
  }
  /* Com um modal aberto as abas saem: por cima dele tapavam os botões do rodapé. */
  html.is-partner body.modal-open .pt-tabs { display: none; }
  html.is-partner .pt-tabs a {
    flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
    padding: 8px 0 10px; color: #8a8f98; font-size: .72rem; font-weight: 600; text-decoration: none;
  }
  html.is-partner .pt-tabs a i { font-size: 1.3rem; }
  html.is-partner .pt-tabs a.active { color: #222; }
  html.is-partner .main-content { padding-bottom: 72px; }
  html.is-partner .footer { display: none; }
  /* Sem menu lateral: as abas fazem esse papel. */
  html.is-partner .sidemenu-toggle { display: none !important; }
}

/* Valor dos cards: nunca abreviado. Inteiro numa linha só, e no celular a
   fonte encolhe para "R$ 12.694,40" caber em meio card. */
.stat-value { white-space: nowrap; }
@media (max-width: 575.98px) { .stat-value { font-size: 1.05rem; } }
