/* ============================================================================
   PAINEL DO USUÁRIO (painel.html) — usa main.css como base
   ========================================================================== */
.dash { min-height: 100vh; background: var(--bg); }
.dash-hero { background: linear-gradient(160deg,#0F1F30,#1C3553); color:#fff; padding: 130px 0 110px; position:relative; overflow:hidden; }
.dash-hero::before { content:''; position:absolute; inset:0; opacity:.5; background: radial-gradient(700px 420px at 85% 10%, rgba(200,169,110,.22), transparent 60%); }
.dash-hero .container { position:relative; z-index:2; }
.dash-hello { font-size:.86rem; color: var(--accent-light); font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.dash-hero h1 { font-size: clamp(1.8rem,4vw,2.8rem); margin-top:8px; color:#fff; }
.dash-hero p { color:#B9C6D4; margin-top:10px; max-width: 560px; }

.dash-body { margin-top: -64px; position:relative; z-index:3; padding-bottom: 90px; }
.dash-tabs { display:flex; gap:8px; background:#fff; border-radius: var(--radius-lg); padding:8px; box-shadow: var(--shadow-md); border:1px solid var(--border); overflow-x:auto; }
.dash-tab { flex:1; min-width: 150px; display:flex; align-items:center; justify-content:center; gap:9px; padding:14px 16px; border-radius: var(--radius-md); font-weight:700; font-size:.92rem; color: var(--text-medium); white-space:nowrap; transition: var(--t-fast); }
.dash-tab svg { width:19px; height:19px; }
.dash-tab .pill { background: var(--accent); color: var(--primary-dark); border-radius: var(--radius-full); padding:1px 9px; font-size:.78rem; }
.dash-tab.is-active { background: var(--primary); color:#fff; box-shadow: var(--shadow-sm); }
.dash-tab.is-active .pill { background: var(--accent-light); }

.dash-panel { display:none; margin-top: 28px; animation: fade-up .4s both; }
.dash-panel.is-active { display:block; }
.dash-panel__head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom: 22px; flex-wrap:wrap; }
.dash-panel__head h2 { font-size:1.5rem; color: var(--primary); }
.dash-panel__head p { color: var(--text-medium); font-size:.94rem; }

/* cards de favoritos */
.dash-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.dcard { background:#fff; border:1px solid var(--border); border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-xs); transition: var(--t); display:flex; flex-direction:column; }
.dcard:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.dcard__media { aspect-ratio: 16/10; position:relative; overflow:hidden; }
.dcard__media img { width:100%; height:100%; object-fit:cover; }
.dcard__art { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.85); }
.dcard__art svg { width:64px; height:64px; }
.dcard__rm { position:absolute; top:10px; right:10px; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; color: var(--cta); box-shadow: var(--shadow-sm); transition: var(--t-fast); }
.dcard__rm:hover { background: var(--cta); color:#fff; }
.dcard__rm svg { width:17px; height:17px; }
.dcard__body { padding:16px 18px 18px; display:flex; flex-direction:column; flex:1; }
.dcard__loc { font-size:.78rem; color: var(--accent-dark); font-weight:700; text-transform:uppercase; }
.dcard__title { font-size:1.04rem; color: var(--primary); margin:5px 0 8px; line-height:1.2; }
.dcard__price { font-family: var(--font-display); font-size:1.3rem; color: var(--primary); }
.dcard__price span { font-family: var(--font-body); font-size:.78rem; color: var(--text-light); }
.dcard__note { margin-top:10px; background: var(--bg); border-radius: var(--radius-sm); padding:10px 12px; font-size:.86rem; color: var(--text-medium); border-left:3px solid var(--accent); }
.dcard__actions { margin-top:auto; padding-top:14px; display:flex; gap:8px; }
.dcard__actions .btn { flex:1; padding:10px; font-size:.84rem; }

/* anotações */
.note-row { background:#fff; border:1px solid var(--border); border-radius: var(--radius-lg); padding:20px; margin-bottom:16px; box-shadow: var(--shadow-xs); }
.note-row__top { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; flex-wrap:wrap; }
.note-row__title { font-family: var(--font-display); font-size:1.12rem; color: var(--primary); }
.note-row__title span { display:block; font-family: var(--font-body); font-size:.78rem; color: var(--accent-dark); font-weight:700; text-transform:uppercase; }
.note-row textarea { width:100%; min-height:70px; resize:vertical; border:1.5px solid var(--border-dark); border-radius: var(--radius-sm); padding:12px 14px; font-size:.94rem; }
.note-row textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(200,169,110,.18); outline:none; }
.note-row__bar { display:flex; justify-content:space-between; align-items:center; margin-top:10px; }
.note-row__status { font-size:.82rem; color: var(--success); font-weight:600; opacity:0; transition: var(--t); }
.note-row__status.show { opacity:1; }

/* alerta de busca */
.alert-box { background:#fff; border:1px solid var(--border); border-radius: var(--radius-lg); padding: 26px; box-shadow: var(--shadow-xs); }
.alert-box h3 { color: var(--primary); font-size:1.2rem; margin-bottom:6px; }
.alert-box p { color: var(--text-medium); font-size:.94rem; margin-bottom:18px; }
.alert-form { display:grid; grid-template-columns: repeat(4,1fr); gap:12px; }
.alert-form select { height:50px; border:1.5px solid var(--border-dark); border-radius: var(--radius-md); padding:0 14px; background:#fff; font-size:.92rem; }
.alert-chips { display:flex; flex-wrap:wrap; gap:10px; margin:18px 0; }
.alert-result { margin-top:24px; }
.alert-banner { display:flex; align-items:center; gap:14px; background: linear-gradient(135deg,#142a44,#1C3553); color:#fff; border-radius: var(--radius-md); padding:18px 22px; margin-bottom:20px; }
.alert-banner svg { width:30px; height:30px; color: var(--accent-light); flex:none; }
.alert-banner b { color: var(--accent-light); }
.dcard__new { position:absolute; top:10px; left:10px; z-index:2; background: var(--cta); color:#fff; font-size:.7rem; font-weight:700; padding:4px 10px; border-radius: var(--radius-full); }

/* estado vazio / login */
.dash-empty { text-align:center; padding: 70px 20px; background:#fff; border-radius: var(--radius-lg); border:1px solid var(--border); }
.dash-empty svg { width:64px; height:64px; color: var(--border-dark); margin:0 auto 18px; }
.dash-empty h3 { color: var(--primary); font-size:1.3rem; }
.dash-empty p { color: var(--text-medium); margin:8px auto 22px; max-width: 420px; }
.dash-gate { max-width: 460px; margin: 40px auto; }

.dash-logout { display:inline-flex; align-items:center; gap:8px; color:#C7D3E0; font-weight:600; font-size:.9rem; transition: var(--t-fast); }
.dash-logout:hover { color:#fff; }
.dash-logout svg { width:18px; height:18px; }

/* zona de segurança / exclusão de conta (LGPD) */
.dash-danger { margin-top: 40px; background:#fff; border:1px solid #f3d6d3; border-radius: var(--radius-lg); padding: 24px 26px; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.dash-danger__txt h4 { color:#b3261e; font-size:1.05rem; margin-bottom:4px; }
.dash-danger__txt p { color: var(--text-medium); font-size:.9rem; max-width: 520px; }
.btn-danger { display:inline-flex; align-items:center; gap:8px; padding:13px 22px; border-radius: var(--radius-full); background:#fdecec; color:#b3261e; font-weight:700; font-size:.9rem; border:1.5px solid #f3c5c1; transition: var(--t-fast); white-space:nowrap; }
.btn-danger:hover { background:#b3261e; color:#fff; border-color:#b3261e; }
.btn-danger svg { width:18px; height:18px; }

/* ====================== RESPONSIVO: TABLET ====================== */
@media (max-width: 1024px) {
  .dash-hero { padding: 120px 0 96px; }
  .dash-grid { grid-template-columns: repeat(2,1fr); }
  .alert-form { grid-template-columns: repeat(2,1fr); }
  .alert-form #alSave { grid-column: 1 / -1; }
  .dash-tab { min-width: 130px; font-size:.88rem; padding: 13px 12px; }
}

/* ====================== RESPONSIVO: CELULAR ====================== */
@media (max-width: 768px) {
  .dash-hero { padding: 104px 0 84px; }
  .dash-hero .container { text-align: center; }
  .dash-hero h1 { font-size: 1.6rem; }
  .dash-hero p { font-size:.92rem; margin-inline: auto; }
  .dash-body { margin-top: -40px; padding-bottom: 64px; }

  /* abas em grade 2x2: todas visíveis, sem precisar arrastar */
  .dash-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px; overflow: visible; }
  .dash-tab { min-width: 0; padding: 13px 8px; font-size:.86rem; justify-content: center; }
  .dash-tab svg { width:17px; height:17px; }

  .dash-panel { margin-top: 22px; }
  .dash-panel__head { flex-direction: column; align-items: center; text-align: center; gap: 10px; }
  .dash-panel__head h2 { font-size: 1.3rem; }
  .dash-panel__head .btn { width: 100%; }

  .dash-grid { grid-template-columns: 1fr; gap: 16px; }
  .alert-box { padding: 20px 18px; }
  .alert-form { grid-template-columns: 1fr; }
  .note-row { padding: 16px; }
  .note-row__top { flex-direction: column; align-items: flex-start; gap: 10px; }
  .note-row__top .btn { width: 100%; justify-content: center; }
  .alert-banner { flex-direction: column; text-align: center; }

  .dash-danger { flex-direction: column; align-items: flex-start; text-align: left; padding: 20px; }
  .btn-danger { width: 100%; justify-content: center; }
  .dash-empty { padding: 48px 18px; }
}

/* ====================== RESPONSIVO: CELULAR PEQUENO ====================== */
@media (max-width: 420px) {
  .dash-hero { padding: 96px 0 76px; }
  .dash-hero h1 { font-size: 1.4rem; }
  .dash-tab { padding: 11px 12px; font-size:.82rem; gap:7px; }
  .dcard__actions { flex-wrap: wrap; }
  .dcard__actions .btn { flex: 1 1 100%; }
}
