/* =====================================================
   P.A.I de Pet — CSS RESPONSIVO COMPLETO
   ===================================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --primary:   #C17F3A;
    --primary-d: #A06828;
    --primary-l: #E8A85F;
    --green:     #7BAE5A;
    --green-d:   #5C8F3E;
    --red:       #C0392B;
    --red-d:     #A93226;
    --orange:    #D4651A;
    --blue:      #5B8FA8;
    --purple:    #8B6B8A;
    --brown:     #7A4A1E;
    --bg:        #FAF3E0;
    --bg2:       #F5E6C8;
    --card:      #FFFFFF;
    --border:    #E8D5B0;
    --text:      #3D2B1A;
    --text-m:    #7A5C3A;
    --nav-bg:    #3D2B1A;
    --nav-text:  #F5E6C8;
    --radius:    12px;
    --shadow:    0 2px 12px rgba(61,43,26,.1);
    --nav-h:     64px;
}

body { font-family: 'Segoe UI', system-ui, sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; }
body.menu-open { overflow: hidden; }

/* ══════════════════════════════════════════
   NAVBAR
══════════════════════════════════════════ */
.navbar {
    background: var(--nav-bg);
    display: flex;
    align-items: center;
    padding: 0 1.25rem;
    height: var(--nav-h);
    position: sticky;
    top: 0;
    z-index: 200;
    box-shadow: 0 3px 12px rgba(0,0,0,.3);
    border-bottom: 3px solid var(--primary);
    gap: .75rem;
}

/* Brand */
.nav-brand { display:flex; align-items:center; gap:.5rem; text-decoration:none; }
.nav-brand-logo { width:36px; height:36px; border-radius:50%; object-fit:cover; border:2px solid var(--primary-l); flex-shrink:0; }
.nav-brand-text { color:var(--primary-l); font-size:1.1rem; font-weight:800; letter-spacing:-.3px; white-space:nowrap; }

/* Links desktop */
.nav-links {
    display: flex;
    list-style: none;
    gap: .15rem;
    flex: 1;
    align-items: center;
}
.nav-links > li > a {
    color: var(--nav-text);
    text-decoration: none;
    padding: .45rem .75rem;
    border-radius: 8px;
    font-size: .85rem;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: .3rem;
    transition: background .2s, color .2s;
}
.nav-links > li > a:hover,
.nav-links > li > a.active { background: var(--primary); color: #fff; }

/* Usuário desktop */
.nav-user-desktop { display:flex; align-items:center; gap:.6rem; color:var(--nav-text); font-size:.85rem; white-space:nowrap; }
.nav-user-mobile { display:none; }

/* Hamburger */
.hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: .4rem;
    border-radius: 8px;
    transition: background .2s;
    flex-shrink: 0;
}
.hamburger:hover { background: rgba(255,255,255,.1); }
.hamburger span {
    display: block;
    width: 24px;
    height: 2.5px;
    background: var(--nav-text);
    border-radius: 2px;
    transition: transform .3s, opacity .3s;
    transform-origin: center;
}
.hamburger.open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

/* Overlay */
.nav-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 150;
}
.nav-overlay.show { display: block; }

/* Header mobile dentro do menu */
.nav-mobile-header { display: none; }

/* Dropdown desktop */
.nav-dropdown { position: relative; }
.nav-dropdown .arrow { font-size: .7rem; transition: transform .2s; }
.dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    background: #4A3020;
    border-radius: 10px;
    min-width: 200px;
    box-shadow: 0 8px 24px rgba(0,0,0,.3);
    z-index: 300;
    padding: .4rem 0;
    list-style: none;
    border-top: 2px solid var(--primary);
}
.nav-dropdown:hover .dropdown-menu { display: block; }
.dropdown-menu li a {
    display: block;
    padding: .6rem 1rem;
    color: var(--nav-text);
    text-decoration: none;
    font-size: .85rem;
    transition: background .15s;
}
.dropdown-menu li a:hover { background: var(--primary); color: #fff; }

/* Logout */
.btn-logout {
    background: rgba(193,127,58,.3);
    color: var(--primary-l);
    border: none;
    padding: .35rem .85rem;
    border-radius: 8px;
    cursor: pointer;
    font-size: .82rem;
    text-decoration: none;
    transition: background .2s;
    white-space: nowrap;
}
.btn-logout:hover { background: var(--primary); color: #fff; }

/* ══════════════════════════════════════════
   LAYOUT
══════════════════════════════════════════ */
.container { max-width: 1400px; margin: 0 auto; padding: 1.5rem; }

.page-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; flex-wrap:wrap; gap:.75rem; }
.page-header h2 { font-size:1.3rem; font-weight:700; }
.date-badge { background:var(--primary); color:#fff; padding:.3rem .8rem; border-radius:20px; font-size:.82rem; font-weight:600; }

/* ── CARDS ── */
.card { background:var(--card); border-radius:var(--radius); box-shadow:var(--shadow); border:1px solid var(--border); overflow:hidden; }
.card-header { display:flex; align-items:center; justify-content:space-between; padding:.9rem 1.2rem; border-bottom:1px solid var(--border); flex-wrap:wrap; gap:.5rem; background:var(--bg2); }
.card-header h3 { font-size:.95rem; font-weight:700; color:var(--brown); }
.mb-4 { margin-bottom:1.5rem; }

/* ── KPI ── */
.kpi-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:.75rem; margin-bottom:1.5rem; }
.kpi-card { border-radius:var(--radius); padding:1.1rem 1.25rem; display:flex; align-items:center; gap:.85rem; box-shadow:var(--shadow); color:#fff; }
.kpi-green  { background:linear-gradient(135deg,#5C8F3E,#7BAE5A); }
.kpi-red    { background:linear-gradient(135deg,#A93226,#C0392B); }
.kpi-blue   { background:linear-gradient(135deg,#3D7A9A,#5B8FA8); }
.kpi-purple { background:linear-gradient(135deg,#6B4F6A,#8B6B8A); }
.kpi-orange { background:linear-gradient(135deg,#C17F3A,#D4651A); }
.kpi-icon   { font-size:1.8rem; line-height:1; flex-shrink:0; }
.kpi-info   { display:flex; flex-direction:column; min-width:0; }
.kpi-label  { font-size:.72rem; opacity:.9; }
.kpi-value  { font-size:1.3rem; font-weight:700; white-space:nowrap; }
.kpi-sub    { font-size:.7rem; opacity:.85; margin-top:.1rem; }

/* ── DASH GRID ── */
.dash-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(420px,1fr)); gap:1rem; }

/* ── TABLE (responsiva) ── */
.table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table { width:100%; border-collapse:collapse; font-size:.85rem; min-width:500px; }
.table th { background:var(--bg2); padding:.65rem 1rem; text-align:left; font-size:.75rem; color:var(--brown); text-transform:uppercase; letter-spacing:.04em; border-bottom:2px solid var(--border); font-weight:700; white-space:nowrap; }
.table td { padding:.6rem 1rem; border-bottom:1px solid var(--bg2); vertical-align:middle; }
.table-striped tbody tr:nth-child(even) { background:#FDFAF5; }
.table-striped tbody tr:hover { background:var(--bg2); }
.table-footer td { background:var(--bg2) !important; font-weight:700; padding:.7rem 1rem; border-top:2px solid var(--border); }
.actions { display:flex; gap:.35rem; flex-wrap:wrap; align-items:center; }

/* ── BADGES ── */
.badge { display:inline-block; padding:.2rem .55rem; border-radius:20px; font-size:.72rem; font-weight:600; white-space:nowrap; }
.badge-agendado     { background:#dbeafe; color:#1d4ed8; }
.badge-confirmado   { background:#d1fae5; color:#065f46; }
.badge-em_andamento { background:#fef3c7; color:#92400e; }
.badge-concluido    { background:#d1fae5; color:#065f46; }
.badge-cancelado    { background:#fee2e2; color:#991b1b; }
.badge-entrada      { background:#d1fae5; color:#065f46; }
.badge-saida        { background:#fee2e2; color:#991b1b; }
.badge-blue         { background:#dbeafe; color:#1d4ed8; }

/* ── BUTTONS ── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.4rem; padding:.5rem 1rem; border-radius:8px; border:none; cursor:pointer; font-size:.85rem; font-weight:600; text-decoration:none; transition:all .2s; white-space:nowrap; }
.btn-primary   { background:var(--primary); color:#fff; }
.btn-primary:hover { background:var(--primary-d); }
.btn-secondary { background:var(--bg2); color:var(--brown); border:1px solid var(--border); }
.btn-secondary:hover { background:var(--border); }
.btn-danger    { background:#fee2e2; color:var(--red); }
.btn-danger:hover { background:var(--red); color:#fff; }
.btn-full      { width:100%; }
.btn-sm        { padding:.3rem .65rem; font-size:.78rem; }

/* ── FORMS ── */
.form-group { display:flex; flex-direction:column; gap:.35rem; flex:1; min-width:0; }
.form-group label { font-size:.82rem; font-weight:600; color:var(--text-m); }
.form-group input,
.form-group select,
.form-group textarea { padding:.5rem .8rem; border:1.5px solid var(--border); border-radius:8px; font-size:.88rem; background:#fff; color:var(--text); transition:border-color .2s, box-shadow .2s; width:100%; }
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(193,127,58,.2); }
.form-row { display:flex; gap:1rem; flex-wrap:wrap; }
.form-row .form-group { min-width:min(100%, 180px); }
.inline-form { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.filter-bar { display:flex; gap:1rem; padding:1rem 1.2rem; flex-wrap:wrap; align-items:flex-end; }
.select-mini { padding:.25rem .5rem; font-size:.8rem; border:1px solid var(--border); border-radius:6px; background:#fff; }
.form-section-title { font-size:.85rem; font-weight:700; color:var(--primary); border-bottom:2px solid var(--bg2); padding-bottom:.4rem; margin-bottom:.25rem; }
.input-file { border:2px dashed var(--border) !important; border-radius:8px !important; padding:.85rem !important; background:var(--bg2) !important; cursor:pointer; }

/* ── ALERTS ── */
.alert { padding:.8rem 1.1rem; border-radius:8px; margin-bottom:1rem; font-size:.88rem; }
.alert-success { background:#d1fae5; color:#065f46; border-left:4px solid var(--green); }
.alert-danger  { background:#fee2e2; color:#991b1b; border-left:4px solid var(--red); }

/* ── MODAL ── */
.modal { position:fixed; inset:0; background:rgba(61,43,26,.5); display:flex; align-items:center; justify-content:center; z-index:500; padding:1rem; }
.modal-box { background:var(--card); border-radius:var(--radius); width:100%; max-width:640px; max-height:92vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,.3); display:flex; flex-direction:column; border-top:4px solid var(--primary); }
.modal-header { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.4rem; border-bottom:1px solid var(--border); background:var(--bg2); position:sticky; top:0; z-index:1; }
.modal-header h3 { font-size:1rem; font-weight:700; color:var(--brown); }
.modal-box form { padding:1.25rem 1.4rem; display:flex; flex-direction:column; gap:.9rem; }
.modal-footer { display:flex; justify-content:flex-end; gap:.75rem; padding-top:.5rem; flex-wrap:wrap; }
.btn-close { background:none; border:none; cursor:pointer; font-size:1.2rem; color:var(--text-m); line-height:1; padding:.2rem .4rem; border-radius:6px; }
.btn-close:hover { color:var(--red); background:#fee2e2; }

/* ── CALENDAR ── */
.calendar { padding:.6rem; }
.cal-head { display:grid; grid-template-columns:repeat(7,1fr); margin-bottom:.25rem; }
.cal-head span { text-align:center; font-size:.7rem; font-weight:700; color:var(--text-m); padding:.35rem 0; text-transform:uppercase; }
.cal-body { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.cal-day { min-height:64px; border:1px solid var(--border); border-radius:6px; padding:.25rem; background:#fff; }
.cal-day.vazio { background:var(--bg2); border-color:transparent; }
.cal-hoje { border-color:var(--primary) !important; background:#FFF5E8 !important; }
.cal-hoje .cal-num { color:var(--primary); font-weight:700; }
.tem-evento { background:#FFF8EE; }
.cal-num { font-size:.75rem; font-weight:600; color:var(--text-m); display:block; }
.cal-evento { font-size:.6rem; border-radius:4px; padding:.1rem .25rem; margin-top:.15rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.status-agendado     { background:#dbeafe; color:#1d4ed8; }
.status-confirmado   { background:#d1fae5; color:#065f46; }
.status-em_andamento { background:#fef3c7; color:#92400e; }
.status-concluido    { background:#d1fae5; color:#065f46; }
.cal-mais { font-size:.6rem; color:var(--primary); margin-top:.1rem; }
.cal-nav  { display:flex; gap:.5rem; }

/* ── PROGRESS BAR ── */
.progress-bar { display:inline-flex; width:70px; height:7px; background:var(--bg2); border-radius:4px; overflow:hidden; vertical-align:middle; margin-right:.35rem; }
.progress-fill { height:100%; border-radius:4px; }
.progress-fill.green { background:var(--green); }
.progress-fill.red   { background:var(--red); }

/* ── FECHAMENTO ── */
.fechamento-header { display:flex; align-items:center; justify-content:space-between; padding:1.2rem 1.5rem; flex-wrap:wrap; gap:.75rem; }
.fechamento-titulo { display:flex; align-items:center; gap:1rem; }
.fechamento-icon { font-size:2.2rem; }
.fechamento-titulo h3 { font-size:1.1rem; font-weight:700; }
.fechamento-titulo p  { color:var(--text-m); font-size:.82rem; margin-top:.2rem; }

/* ── PERFIL PET ── */
.pet-profile-card { display:flex; gap:0; overflow:hidden; flex-wrap:wrap; }
.pet-profile-left { background:linear-gradient(160deg,#3D2B1A,#7A4A1E); color:#fff; padding:1.75rem 1.5rem; display:flex; flex-direction:column; align-items:center; gap:.5rem; min-width:190px; text-align:center; }
.pet-avatar { width:120px; height:120px; border-radius:50%; object-fit:cover; border:4px solid var(--primary-l); margin-bottom:.5rem; }
.pet-avatar-placeholder { width:120px; height:120px; border-radius:50%; background:rgba(255,255,255,.15); display:flex; align-items:center; justify-content:center; font-size:3.5rem; margin-bottom:.5rem; }
.pet-nome { font-size:1.3rem; font-weight:700; }
.pet-dono { font-size:.82rem; opacity:.8; }
.pet-profile-info { flex:1; padding:1.25rem; min-width:280px; }
.pet-info-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:.6rem 1.25rem; margin-bottom:1.1rem; }
.pet-info-item { display:flex; flex-direction:column; gap:.12rem; }
.info-label { font-size:.7rem; color:var(--text-m); text-transform:uppercase; letter-spacing:.04em; font-weight:600; }
.info-val   { font-size:.9rem; font-weight:500; }
.alerta-tosador { background:#fef3c7; border:1.5px solid #f59e0b; border-radius:8px; padding:.8rem 1rem; display:flex; gap:.75rem; align-items:flex-start; margin-bottom:1rem; }
.alerta-tosador .alerta-icon { font-size:1.4rem; flex-shrink:0; }
.alerta-tosador strong { display:block; font-size:.82rem; color:#92400e; margin-bottom:.2rem; }
.alerta-tosador p { font-size:.87rem; color:#78350f; margin:0; }
.pet-saude-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:.65rem; margin-top:.75rem; }
.saude-item { background:var(--bg2); border:1px solid var(--border); border-radius:8px; padding:.8rem .9rem; }
.saude-item.saude-alerta { background:#fff1f2; border-color:#fecdd3; }
.saude-item h4 { font-size:.78rem; color:var(--text-m); margin-bottom:.3rem; }
.saude-item p  { font-size:.85rem; margin:0; }

/* ── HISTÓRICO PET ── */
.historico-lista { padding:.5rem 1.1rem 1.1rem; display:flex; flex-direction:column; gap:.65rem; }
.historico-item { border:1px solid var(--border); border-radius:10px; padding:.9rem 1.1rem; background:var(--bg2); }
.historico-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:.35rem; flex-wrap:wrap; gap:.3rem; }
.historico-data { font-weight:700; font-size:.88rem; color:var(--brown); }
.historico-tosador { font-size:.8rem; color:var(--text-m); }
.historico-obs { font-size:.85rem; margin:.35rem 0; }
.historico-detalhes { display:flex; gap:.75rem; flex-wrap:wrap; font-size:.78rem; color:var(--text-m); margin-top:.3rem; }
.fotos-banho { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.6rem; }
.foto-banho-thumb { width:65px; height:65px; object-fit:cover; border-radius:8px; border:2px solid var(--border); cursor:pointer; transition:transform .2s; }
.foto-banho-thumb:hover { transform:scale(1.08); border-color:var(--primary); }
.galeria-grid { display:flex; flex-wrap:wrap; gap:.65rem; padding:1.1rem; }
.galeria-item { display:flex; flex-direction:column; align-items:center; gap:.3rem; text-decoration:none; color:var(--text-m); font-size:.72rem; }
.galeria-item img { width:100px; height:100px; object-fit:cover; border-radius:10px; border:2px solid var(--border); transition:transform .2s; }
.galeria-item:hover img { transform:scale(1.06); border-color:var(--primary); }

/* ── PETS CARDS ── */
.pets-cards-grid { display:flex; flex-wrap:wrap; gap:.9rem; padding:1.1rem; }
.pet-card-mini { border:1px solid var(--border); border-radius:12px; padding:.9rem; width:190px; display:flex; flex-direction:column; align-items:center; text-align:center; background:#fff; transition:box-shadow .2s, border-color .2s; }
.pet-card-mini:hover { box-shadow:0 4px 16px rgba(193,127,58,.2); border-color:var(--primary-l); }
.pet-card-foto img { width:72px; height:72px; border-radius:50%; object-fit:cover; border:3px solid var(--primary); margin-bottom:.5rem; }
.pet-emoji { font-size:3rem; display:block; margin-bottom:.35rem; }
.pet-card-info { display:flex; flex-direction:column; gap:.2rem; font-size:.83rem; }
.pet-card-info strong { font-size:.9rem; color:var(--brown); }
.obs-tosador-mini { font-size:.72rem; color:#92400e; background:#fef3c7; border-radius:6px; padding:.2rem .45rem; margin-top:.3rem; text-align:left; }
.obs-tosador-inline { background:#fef3c7; border-left:3px solid #f59e0b; padding:.28rem .55rem; border-radius:0 6px 6px 0; font-size:.78rem; color:#78350f; max-width:240px; }
.pet-link { text-decoration:none; color:var(--primary); font-size:.82rem; font-weight:600; }
.pet-link:hover { text-decoration:underline; }

/* ── CARGO BADGE ── */
.cargo-badge { display:inline-block; padding:.1rem .4rem; border-radius:10px; font-size:.66rem; font-weight:600; margin-left:.3rem; vertical-align:middle; }
.cargo-admin       { background:#F5E6C8; color:#7A4A1E; }
.cargo-gerente     { background:#fce7f3; color:#9d174d; }
.cargo-atendente   { background:#dbeafe; color:#1e40af; }
.cargo-veterinario { background:#d1fae5; color:#065f46; }
.cargo-tosador     { background:#f5d0fe; color:#6b21a8; }

/* ── HELPERS ── */
.text-green { color:var(--green-d); }
.text-red   { color:var(--red-d); }
.fw-bold    { font-weight:700; }
.mt-1       { margin-top:.35rem; }
.ml-1       { margin-left:.35rem; }
.empty-state { padding:2rem; text-align:center; color:var(--text-m); font-size:.88rem; }

/* ── FOOTER ── */
.footer { text-align:center; padding:1.25rem; color:var(--text-m); font-size:.8rem; border-top:2px solid var(--border); margin-top:2rem; background:var(--bg2); }

/* ══════════════════════════════════════════
   LOGIN
══════════════════════════════════════════ */
.login-body { display:flex; align-items:center; justify-content:center; min-height:100vh; background:linear-gradient(135deg,#3D2B1A 0%,#7A4A1E 50%,#C17F3A 100%); padding:1rem; }
.login-card { background:#fff; border-radius:var(--radius); padding:2.25rem 2rem; width:100%; max-width:400px; box-shadow:0 20px 60px rgba(0,0,0,.35); text-align:center; }
.login-logo { margin-bottom:.75rem; }
.login-card h1 { font-size:1.5rem; color:var(--primary); margin-bottom:.2rem; font-weight:800; }
.login-sub { color:var(--text-m); margin-bottom:1.4rem; font-size:.88rem; }

/* ══════════════════════════════════════════
   RESPONSIVE — TABLET (≤900px)
══════════════════════════════════════════ */
@media (max-width: 900px) {

    /* Mostra hamburger, esconde desktop nav */
    .hamburger { display:flex; order:-1; }
    .nav-user-desktop { display:none; }
    .nav-user-mobile { display:flex !important; align-items:center; justify-content:space-between; padding:1rem 1.25rem; border-top:1px solid rgba(255,255,255,.1); margin-top:auto; }
    .nav-user-info { display:flex; flex-direction:column; gap:.2rem; color:var(--nav-text); font-size:.88rem; }

    /* Drawer lateral */
    .nav-links {
        position: fixed;
        top: 0;
        left: -280px;
        width: 280px;
        height: 100vh;
        background: var(--nav-bg);
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        z-index: 300;
        overflow-y: auto;
        transition: left .3s cubic-bezier(.4,0,.2,1);
        padding-bottom: 1rem;
    }
    .nav-links.open { left: 0; }

    /* Header dentro do drawer */
    .nav-mobile-header {
        display: flex;
        align-items: center;
        gap: .75rem;
        padding: 1rem 1.25rem;
        border-bottom: 1px solid rgba(255,255,255,.1);
        margin-bottom: .5rem;
        flex-shrink: 0;
    }
    .nav-close {
        margin-left: auto;
        background: none;
        border: none;
        color: var(--nav-text);
        font-size: 1.3rem;
        cursor: pointer;
        padding: .2rem .4rem;
        border-radius: 6px;
    }
    .nav-close:hover { background: rgba(255,255,255,.1); }

    /* Links no drawer */
    .nav-links > li > a {
        padding: .85rem 1.25rem;
        border-radius: 0;
        font-size: .95rem;
        border-bottom: 1px solid rgba(255,255,255,.05);
    }
    .nav-links > li > a:hover,
    .nav-links > li > a.active {
        background: var(--primary);
        border-radius: 0;
    }

    /* Dropdown mobile (accordion) */
    .nav-dropdown .dropdown-menu {
        position: static;
        box-shadow: none;
        border-radius: 0;
        border-top: none;
        display: none;
        background: rgba(0,0,0,.2);
        padding: 0;
        margin: 0;
        min-width: unset;
    }
    .nav-dropdown.dropdown-open .dropdown-menu { display: block; }
    .nav-dropdown.dropdown-open .arrow { transform: rotate(180deg); }
    .dropdown-menu li a { padding:.7rem 1.75rem; font-size:.9rem; }

    /* Brand no centro */
    .nav-brand { flex: 1; justify-content: center; }

    /* Layout */
    .dash-grid { grid-template-columns: 1fr; }
    .kpi-grid  { grid-template-columns: repeat(2, 1fr); }
    .container { padding: 1rem; }
    .filter-bar { padding: .75rem 1rem; }
}

/* ══════════════════════════════════════════
   RESPONSIVE — MOBILE (≤560px)
══════════════════════════════════════════ */
@media (max-width: 560px) {

    .kpi-grid { grid-template-columns: 1fr 1fr; gap:.5rem; }
    .kpi-card { padding:.9rem 1rem; gap:.6rem; }
    .kpi-value { font-size:1.1rem; }
    .kpi-icon  { font-size:1.5rem; }

    .page-header { flex-direction:column; align-items:flex-start; }
    .page-header .btn { width:100%; }

    .form-row { flex-direction:column; gap:.75rem; }
    .modal-box { max-height:95vh; border-radius:var(--radius) var(--radius) 0 0; }
    .modal { align-items:flex-end; padding:0; }

    .cal-day { min-height:40px; padding:.15rem; }
    .cal-evento { display:none; }
    .cal-num { font-size:.68rem; }

    .pet-profile-card { flex-direction:column; }
    .pet-profile-left { min-width:unset; width:100%; padding:1.25rem 1rem; }
    .pet-profile-info { min-width:unset; }

    .pet-card-mini { width:100%; flex-direction:row; text-align:left; gap:.75rem; }
    .pet-card-foto img { width:56px; height:56px; margin-bottom:0; }

    .pets-cards-grid { padding:.75rem; gap:.65rem; }
    .historico-lista { padding:.4rem .75rem .75rem; }

    .btn-sm { padding:.3rem .55rem; font-size:.75rem; }
    .table { font-size:.8rem; }
    .table th, .table td { padding:.5rem .65rem; }

    .actions { gap:.25rem; }
    .actions .btn { padding:.28rem .5rem; font-size:.72rem; }
}

/* ══════════════════════════════════════════
   RESPONSIVE — MINI (≤380px)
══════════════════════════════════════════ */
@media (max-width: 380px) {
    .kpi-grid { grid-template-columns:1fr; }
    .nav-links { width:100%; left:-100%; }
}
