/* ── Agenda module ─────────────────────────────────────────────── */

.ag-container { display: flex; flex-direction: column; gap: .75rem; }

/* toolbar */
.ag-toolbar {
    display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem;
    background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--border-radius);
    padding: .625rem 1rem;
}
.ag-toolbar-left  { display: flex; align-items: center; gap: .375rem; }
.ag-toolbar-center { display: flex; align-items: center; }
.ag-toolbar-right  { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.ag-title { font-weight: 600; font-size: 1rem; margin-left: .5rem; min-width: 200px; }

/* body */
.ag-body {
    background: var(--bg-card); border: 1px solid var(--border-color);
    border-radius: var(--border-radius); overflow: hidden;
}
.ag-empty { text-align: center; padding: 3rem; color: var(--text-muted); }
.ag-spinner { text-align: center; padding: 1rem; color: var(--text-muted); font-size: .875rem; }

/* ── Month view ──────────────────────────────────────────────────── */
.ag-month-grid {
    display: grid; grid-template-columns: repeat(7, 1fr);
}
.ag-month-header {
    padding: .5rem; text-align: center; font-size: .75rem; font-weight: 600;
    color: var(--text-muted); border-bottom: 1px solid var(--border-color);
    text-transform: uppercase; letter-spacing: .04em;
}
.ag-month-cell {
    min-height: 100px; padding: .375rem; border-right: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color); cursor: pointer; vertical-align: top;
    transition: background .1s;
}
.ag-month-cell:nth-child(7n) { border-right: none; }
.ag-month-cell:hover { background: var(--bg-body); }
.ag-other-month .ag-day-num { color: var(--text-muted); opacity: .4; }
.ag-today .ag-day-num {
    background: var(--color-primary); color: #fff; border-radius: 50%;
    width: 24px; height: 24px; display: inline-flex; align-items: center;
    justify-content: center; font-weight: 700;
}
.ag-day-num { font-size: .8125rem; font-weight: 500; margin-bottom: .25rem; display: inline-block; }
.ag-day-events { display: flex; flex-direction: column; gap: 2px; }
.ag-more-link { font-size: .7rem; color: var(--text-muted); padding: 0 2px; }

/* ── Event chips ─────────────────────────────────────────────────── */
.ag-event-chip {
    display: flex; align-items: center; gap: 3px;
    padding: 2px 5px; border-radius: 3px; font-size: .7rem;
    cursor: pointer; overflow: hidden; white-space: nowrap;
    border-left-width: 3px; border-left-style: solid;
    transition: opacity .1s; user-select: none;
}
.ag-event-chip:hover { opacity: .85; }
.ag-chip-dot { width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0; }
.ag-chip-label { overflow: hidden; text-overflow: ellipsis; }

/* ── Week view ───────────────────────────────────────────────────── */
.ag-week-grid {
    display: grid;
    grid-template-columns: 52px repeat(7, 1fr);
    overflow-x: auto;
}
.ag-week-time-col { border-right: 1px solid var(--border-color); }
.ag-week-corner   { height: 44px; border-bottom: 1px solid var(--border-color); }
.ag-time-slot {
    display: flex; align-items: flex-start; justify-content: flex-end;
    padding-right: 6px; font-size: .7rem; color: var(--text-muted);
    border-bottom: 1px solid var(--border-color); box-sizing: border-box;
}
.ag-week-day-col { border-right: 1px solid var(--border-color); }
.ag-week-day-col:last-child { border-right: none; }
.ag-week-day-header {
    height: 44px; display: flex; align-items: center; justify-content: center;
    font-size: .8125rem; font-weight: 500; border-bottom: 1px solid var(--border-color);
    position: sticky; top: 0; background: var(--bg-card); z-index: 1;
}
.ag-week-day-header.ag-today { color: var(--color-primary); font-weight: 700; }
.ag-today-col > .ag-week-day-body { background: #fafbff; }
.ag-week-day-body { position: relative; }
.ag-hour-line {
    position: absolute; left: 0; right: 0; height: 1px;
    background: var(--border-color); pointer-events: none;
}
.ag-week-event {
    position: absolute; left: 2px; right: 2px;
    border-radius: 4px; padding: 2px 4px; font-size: .7rem;
    overflow: hidden; cursor: pointer; z-index: 1;
    border-left-width: 3px; border-left-style: solid;
}
.ag-week-event:hover { opacity: .85; }
.ag-ev-title { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.ag-ev-time  { display: block; font-size: .65rem; color: var(--text-muted); }
.ag-allday-event {
    margin: 2px; border-radius: 3px; padding: 2px 5px; font-size: .7rem;
    cursor: pointer; overflow: hidden; white-space: nowrap;
    border-left-width: 3px; border-left-style: solid;
}

/* ── Day view ────────────────────────────────────────────────────── */
.ag-day-list { display: flex; flex-direction: column; gap: .5rem; padding: .75rem; }
.ag-day-row {
    display: flex; gap: 1rem; padding: .625rem .75rem; border-radius: 6px;
    cursor: pointer; transition: opacity .1s; border-left-width: 4px; border-left-style: solid;
}
.ag-day-row:hover { opacity: .85; }
.ag-day-row-time { font-size: .75rem; color: var(--text-muted); min-width: 90px; padding-top: .125rem; }
.ag-day-row-info { display: flex; flex-direction: column; gap: 2px; }
.ag-day-row-info strong { font-size: .875rem; }
.ag-day-row-info .badge { align-self: flex-start; }
.ag-day-row-info .text-muted { font-size: .75rem; }

/* ── Popover ─────────────────────────────────────────────────────── */
.ag-popover {
    position: fixed; z-index: 9000;
    background: var(--bg-card); border: 1px solid var(--border-color);
    border-radius: var(--border-radius); box-shadow: 0 8px 24px rgba(0,0,0,.15);
    padding: .75rem; font-size: .8125rem; min-width: 260px;
}
.ag-pop-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.ag-pop-close {
    background: none; border: none; cursor: pointer; font-size: 1.25rem;
    color: var(--text-muted); line-height: 1; padding: 0; margin-left: auto;
}
.ag-pop-title { font-weight: 600; font-size: .9375rem; margin-bottom: .5rem; }
.ag-pop-row {
    display: flex; align-items: flex-start; gap: .375rem;
    color: var(--text-secondary); margin-bottom: .25rem; font-size: .8125rem;
}
.ag-pop-row b { color: var(--text-primary); }
.ag-pop-actions { display: flex; gap: .5rem; margin-top: .75rem; padding-top: .5rem; border-top: 1px solid var(--border-color); }

/* badge tipo overrides (fallback) */
.badge-audiencia { background: #dbeafe; color: #1d4ed8; }
.badge-turno     { background: #dcfce7; color: #15803d; }
.badge-tarea     { background: #ffedd5; color: #c2410c; }

/* modal tipo tabs */
.ag-tipo-tab.active,
.ag-tipo-tab:focus { background: var(--color-primary); color: #fff; }

/* ── Agenda mobile (≤640px) ─────────────────────────────────────── */
@media (max-width: 640px) {
  /* Toolbar: apilar en 2 filas */
  .ag-toolbar { flex-direction: column; align-items: stretch; gap: .5rem; }
  .ag-toolbar-left,
  .ag-toolbar-center,
  .ag-toolbar-right { justify-content: center; }
  .ag-title { min-width: unset; text-align: center; }

  /* Vista mensual: scroll horizontal, celdas compactas */
  .ag-body { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ag-month-grid { min-width: 480px; }
  .ag-month-cell { min-height: 64px; padding: .25rem; }
  .ag-day-num { font-size: .7rem; }
  .ag-event-chip { font-size: .6rem; padding: 1px 3px; }

  /* Vista semana: ya tiene overflow-x:auto */
  /* Vista día: ok */

  /* Popover: full width en mobile */
  .ag-popover { left: .75rem !important; right: .75rem !important; width: auto !important; min-width: unset; }
}