/* ===========================================================
   Agenda — estilos específicos (reaproveita tokens do :root)
   NÃO altera header/nav globais do site
   =========================================================== */

/* ============ Layout e cabeçalho da página ============ */
.page-header.page-header-split{
    display:flex;justify-content:space-between;align-items:flex-end;
    gap:var(--gap-2);margin-bottom:var(--gap-2);
  }
  .page-header .title-group h1{
    margin:0 0 .25rem;font-size:var(--fs-lg);color:var(--primary-blue)
  }
  .page-header .title-group p{
    margin:0;color:var(--light-text);font-size:var(--fs-base)
  }
  .actions-group{display:flex;gap:var(--gap-1);flex-wrap:wrap}
  
  .agenda-grid{display:grid;grid-template-columns:320px 1fr;gap:var(--gap-2)}
  @media (max-width:992px){.agenda-grid{grid-template-columns:1fr}}
  
  .card{
    background:var(--white);border:1px solid var(--border-color);
    border-radius:var(--radius);box-shadow:var(--box-shadow);
  }
  
  /* ============ Calendário lateral ============ */
  .calendar-card{position:sticky;top:var(--gap-2);padding:var(--gap-2)}
  .calendar-header{
    display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--gap-1)
  }
  .calendar-header h2{
    margin:0;font-size:var(--fs-base);font-weight:700;color:var(--secondary-blue);
    text-transform:capitalize
  }
  
  .ghost{
    width:32px;height:32px;border-radius:6px;display:grid;place-items:center;
    border:1px solid var(--border-color);background:var(--white);cursor:pointer;
  }
  .ghost:hover{background:var(--light-gray-bg)}
  
  .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center}
  .weekday{font-size:.8rem;color:var(--light-text);font-weight:600}
  
  .day{
    display:flex;align-items:center;justify-content:center;height:34px;width:34px;margin:0 auto;
    border-radius:50%;cursor:pointer;transition:transform .05s ease, background-color .2s, border-color .2s;
  }
  .day:active{transform:scale(.96)}
  .day:hover{background:var(--light-gray-bg)}
  .day.today{background:var(--primary-blue);color:#fff}
  .day.selected{
    border:2px solid var(--secondary-blue);
    background:#eef3fb;color:var(--secondary-blue);
  }
  .day.today.selected{
    background:var(--secondary-blue);color:#fff;border-color:transparent;
    box-shadow:0 0 0 3px rgba(46,74,128,.15);
  }
  .day:focus-visible{
    outline:3px solid rgba(46,74,128,.35);outline-offset:2px;border-radius:50%;
  }
  
  /* Legendas */
  .legend-card{margin-top:var(--gap-1);padding:var(--gap-1)}
  .legend-title{margin:0 0 6px;color:var(--light-text);font-size:var(--fs-sm);font-weight:600}
  .legend-row{display:flex;align-items:center;gap:8px;margin:4px 0}
  .dot{width:10px;height:10px;border-radius:50%}
  .dot-blue{background:var(--secondary-blue)}
  .dot-green{background:var(--green-active)}
  .dot-gray{background:#b7b9cc}
  
  /* ============ Conteúdo (timeline + notas) ============ */
  .date-bar{display:flex;align-items:center;gap:var(--gap-1);margin-bottom:var(--gap-1)}
  .date-bar h3{
    margin:0;font-size:var(--fs-base);font-weight:700;color:var(--dark-text);
    text-transform:capitalize
  }
  
  .day-layout{display:grid;grid-template-columns:1fr 380px;gap:var(--gap-2)}
  @media (max-width:1180px){.day-layout{grid-template-columns:1fr}}
  
  /* Timeline por horas */
  .day-timeline{padding:6px 0}
  .hour-row{
    display:grid;grid-template-columns:64px 1fr;align-items:start;padding:10px 12px;background:var(--white);
    border-top:1px dashed var(--border-color);border-left:1px solid var(--border-color);border-right:1px solid var(--border-color)
  }
  .hour-row:first-child{border-top:1px solid var(--border-color);border-top-left-radius:var(--radius);border-top-right-radius:var(--radius)}
  .hour-row:last-child{border-bottom:1px solid var(--border-color);border-bottom-left-radius:var(--radius);border-bottom-right-radius:var(--radius)}
  .hour-label{color:var(--light-text);font-size:.85rem}
  .slot{min-height:44px;position:relative}
  
  /* Cart do evento/anotação na timeline */
  .event{
    position:absolute;left:6px;right:6px;top:4px;padding:8px;border-radius:var(--radius);
    background:var(--light-gray-bg);border:1px solid var(--border-color);font-size:var(--fs-sm)
  }
  .event.important{border-left:4px solid var(--secondary-blue)}
  .event.meeting{border-left:4px solid var(--green-active)}
  .event.quick{border-left:4px solid #b7b9cc}
  .ev-title{margin:0 0 2px;font-weight:600}
  .ev-desc{margin:0;color:var(--light-text);font-size:.85rem}
  
  /* Ações no card */
  .note-actions{position:absolute;right:8px;top:6px;display:flex;gap:6px}
  .icon-btn{
    width:28px;height:28px;border-radius:6px;border:1px solid var(--border-color);
    background:var(--white);display:grid;place-items:center;cursor:pointer;font-size:.9rem;
  }
  .icon-btn:hover{background:var(--light-gray-bg)}
  
  /* ============ Painel de notas (coluna direita) ============ */
  .notes-card{padding:var(--gap-2)}
  .notes-head{
    display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:var(--gap-1);
  }
  #notes-count{font-weight:700;color:var(--primary-blue)}
  .chip-row{display:flex;gap:6px;flex-wrap:wrap}
  
  .chip{
    border:1px solid var(--border-color);background:var(--white);border-radius:999px;
    padding:.25rem .6rem;font-size:.8rem;cursor:pointer
  }
  .chip:hover{background:var(--light-gray-bg)}
  .chip.is-active{background:var(--light-gray-bg);border-color:#cfd6ee}
  
  .notes-list{display:grid;gap:8px}
  .notes-list.empty p{color:var(--light-text);margin:4px 0}
  
  /* ============ Popover "Alterar Data" ============ */
  .popover{
    display:none;position:absolute;z-index:1000;width:320px;background:var(--white);
    border:1px solid var(--border-color);border-radius:var(--radius);box-shadow:var(--box-shadow);
    padding:var(--gap-1)
  }
  .popover.show{display:block}
  
  /* ============ Modal (base) ============ */
  .modal{
    display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1050;
    align-items:center;justify-content:center;overflow:auto; /* overlay rola, conteúdo não */
  }
  .modal.show{display:flex}
  
  .modal-content{
    background:var(--white);border-radius:var(--radius);width:90%;max-width:560px;
    box-shadow:var(--box-shadow);display:flex;flex-direction:column;overflow:visible;
  }
  .modal-header{
    display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;
    border-bottom:1px solid var(--border-color);background:#f8f9fc;border-top-left-radius:var(--radius);border-top-right-radius:var(--radius)
  }
  .modal-header h3{margin:0;color:var(--primary-blue)}
  .close-button{padding:1rem;background:transparent;border:0;font-size:1.5rem;opacity:.55;cursor:pointer}
  .close-button:hover{opacity:.85}
  .modal-body{padding:1.25rem;overflow:visible}
  .modal-footer{
    display:flex;justify-content:flex-end;gap:8px;padding:1rem 1.25rem;border-top:1px solid var(--border-color)
  }
  
  /* Inputs */
  .label{display:block;font-size:.85rem;color:var(--light-text);margin:.25rem 0}
  .input,.textarea{
    width:100%;border:1px solid var(--border-color);border-radius:var(--radius);
    padding:.6rem .75rem;font-size:var(--fs-base);max-width:100%;box-sizing:border-box;
  }
  .textarea{min-height:110px;resize:vertical;overflow-x:hidden;white-space:pre-wrap}
  
  /* Chips de seleção */
  .chips-select{display:flex;gap:8px;margin:6px 0 12px}
  .chip-select{
    border:1px solid var(--border-color);background:var(--white);border-radius:999px;
    padding:.35rem .8rem;font-size:.85rem;cursor:pointer
  }
  .chip-select.selected{background:#eef3fb;border-color:#cfd6ee}
  
  /* ============ Modal Nova Anotação (ajustes compactos) ============ */
  #note-modal .modal-content{max-width:560px;border-radius:12px;width:calc(100vw - 40px)}
  #note-modal .modal-header{padding:.75rem 1rem;background:#f9fbff}
  #note-modal .modal-header h3{font-size:1.25rem;margin:0}
  #note-modal .modal-body{padding:.9rem 1rem}
  #note-modal .modal-footer{padding:.75rem 1rem}
  #note-modal .btn{padding:.45rem .85rem;font-size:.95rem;border-radius:8px}
  
  #note-modal .input::placeholder,
  #note-modal .textarea::placeholder{color:#a8b0bb}
  
  /* Grid do topo do modal: Título (full) + Data / Hora */
  #note-modal .grid3{
    display:grid;grid-template-columns:1fr 160px 120px;gap:10px;margin-bottom:10px;min-width:0;
  }
  #note-modal .grid3 .full{grid-column:1 / -1}
  @media (max-width:640px){
    #note-modal .grid3{grid-template-columns:1fr 1fr}
    #note-modal .grid3 .full{grid-column:1 / -1}
  }
  @media (max-width:480px){
    #note-modal .grid3{grid-template-columns:1fr}
  }
  
  /* Erro de data */
  .field-error{color:#dc3545;font-size:.8rem;margin-top:.25rem;display:block}
  
  /* ============ Modal de exclusão (menor) ============ */
  #delete-modal .modal-content{max-width:400px;border-radius:10px}
  #delete-modal .modal-header{padding:.75rem 1rem}
  #delete-modal .modal-header h3{font-size:1.1rem}
  #delete-modal .modal-body{padding:.75rem 1rem;font-size:.9rem;color:var(--light-text)}
  #delete-modal .modal-footer{padding:.75rem 1rem}
  #delete-modal .btn{padding:.45rem .9rem;font-size:.9rem}
  
  /* Botão destrutivo */
  .btn-danger{
    background:#dc3545;color:#fff;border:1px solid #dc3545;
    border-radius:var(--radius);padding:.55rem .9rem;font-weight:600;cursor:pointer;
  }
  .btn-danger:hover{filter:brightness(.95)}