/* ============================================================
   Awareness & Events Calendar — page-specific styles
   Relies on design tokens defined in styles.css (:root)
   ============================================================ */

.cal-page-head{padding-block:clamp(40px,6vw,64px) clamp(28px,4vw,40px);}

.cal-controls{
  display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px;
  padding:20px 0; border-bottom:1px solid var(--line);
}
.cal-nav{display:flex; align-items:center; gap:10px;}
.cal-nav-btn{
  width:40px; height:40px; border-radius:50%; border:1.5px solid var(--line); background:var(--paper-raised);
  color:var(--ink); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1.1rem;
  transition:background .2s;
}
.cal-nav-btn:hover{background:var(--blush);}
.cal-today{width:auto; border-radius:999px; padding:0 16px; font-size:.82rem; font-weight:700;}
.cal-label{font-size:clamp(1.15rem,2vw,1.5rem); margin-left:4px; white-space:nowrap;}
.cal-jump{
  margin-left:6px; border:1.5px solid var(--line); background:var(--paper-raised); color:var(--ink-soft);
  border-radius:999px; padding:.4em 1em; font-size:.78rem; font-weight:700; cursor:pointer;
}
.cal-views{display:flex; gap:4px; background:var(--blush); border-radius:999px; padding:4px;}
.cal-view-btn{
  border:0; background:transparent; padding:.5em 1.1em; border-radius:999px; font-weight:700; font-size:.84rem;
  color:var(--ink-soft); cursor:pointer; transition:background .2s, color .2s;
}
.cal-view-btn[aria-selected="true"]{background:var(--paper-raised); color:var(--ink); box-shadow:var(--shadow-1);}
.cal-search{margin-left:auto; flex:0 1 260px; min-width:180px;}
.cal-search input{
  width:100%; padding:.65em 1.1em; border-radius:999px; border:1.5px solid var(--line); background:var(--paper-raised);
  color:var(--ink); font-size:.9rem;
}
.cal-search input::placeholder{color:var(--ink-faint);}

.cal-filters{display:flex; flex-wrap:wrap; gap:8px; padding:18px 0;}
.cal-filter-chip{
  display:inline-flex; align-items:center; gap:.5em; border:1.5px solid var(--line); background:var(--paper-raised);
  padding:.4em .9em; border-radius:999px; font-size:.78rem; font-weight:700; color:var(--ink-soft); cursor:pointer;
  transition:border-color .2s, background .2s, color .2s;
}
.cal-filter-chip .dot{width:9px; height:9px; border-radius:50%; flex-shrink:0;}
.cal-filter-chip[aria-pressed="true"]{color:var(--ink); border-color:currentColor; background:var(--chip-wash, var(--blush));}
.cal-filter-chip:hover{transform:translateY(-1px); box-shadow:var(--shadow-1);}
.cal-filter-chip .cal-chip-count{
  font-size:.68rem; font-weight:800; background:rgba(0,0,0,.06); border-radius:999px; padding:.05em .5em; margin-left:2px;
}
.cal-filter-reset{font-weight:700; font-size:.78rem; color:var(--ink-faint); background:none; border:0; cursor:pointer; text-decoration:underline; text-underline-offset:3px;}

.cal-banner{display:flex; flex-direction:column; gap:8px; margin-bottom:22px;}
.cal-banner-item{
  display:flex; align-items:center; gap:10px; padding:12px 16px; border-radius:14px; border:1.5px solid var(--line);
  background:var(--paper-raised); cursor:pointer; font-size:.88rem; transition:background .15s, transform .15s, box-shadow .15s;
}
.cal-banner-item:hover{background:var(--blush); transform:translateX(3px); box-shadow:var(--shadow-1);}
.cal-banner-item .dot{width:10px; height:10px; border-radius:50%; flex-shrink:0;}
.cal-banner-item .cal-banner-title{font-weight:700; color:var(--ink);}
.cal-banner-item .cal-banner-range{color:var(--ink-faint); font-size:.78rem; margin-left:auto; white-space:nowrap;}
.cal-banner-empty{color:var(--ink-faint); font-size:.85rem; font-style:italic;}

/* ---- Month grid ---- */
.cal-month-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:6px;}
.cal-dow{text-align:center; font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); padding-bottom:6px;}
.cal-day-cell{
  min-height:96px; border-radius:14px; border:1.5px solid var(--line); background:var(--paper-raised);
  padding:8px; display:flex; flex-direction:column; gap:4px; transition:box-shadow .15s, border-color .15s;
}
.cal-day-cell:not(.is-outside):hover{box-shadow:var(--shadow-1); border-color:var(--ink-faint);}
.cal-day-cell.is-outside{background:var(--blush); opacity:.6;}
.cal-day-cell.is-today{border-color:var(--red-strong); box-shadow:0 0 0 2px var(--red-wash) inset;}
.cal-day-num{font-size:.78rem; font-weight:800; color:var(--ink-soft);}
.cal-day-cell.is-today .cal-day-num{color:var(--red-strong);}
.cal-event-chip{
  display:flex; align-items:center; gap:5px; font-size:.68rem; font-weight:700; line-height:1.25;
  padding:3px 7px; border-radius:8px; cursor:pointer; text-align:left; border:0; width:100%;
  background:var(--chip-wash, var(--blush)); color:var(--ink); transition:transform .12s, box-shadow .12s;
}
.cal-event-chip:hover{transform:scale(1.03); box-shadow:var(--shadow-1);}
.cal-event-chip .dot{width:7px; height:7px; border-radius:50%; flex-shrink:0;}
.cal-event-chip span.txt{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
@media (max-width:900px){
  .cal-day-cell{min-height:80px;}
  .cal-dow{font-size:.62rem;}
}
@media (max-width:640px){
  .cal-month-grid{display:none;}
}

/* ---- Week view ---- */
.cal-week-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:10px;}
.cal-week-col{border-radius:14px; border:1.5px solid var(--line); background:var(--paper-raised); padding:10px; min-height:140px;}
.cal-week-col.is-today{border-color:var(--red-strong); box-shadow:0 0 0 2px var(--red-wash) inset;}
.cal-week-head{font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-faint);}
.cal-week-num{font-size:1.1rem; font-weight:700; color:var(--ink); margin-bottom:8px;}
@media (max-width:760px){ .cal-week-grid{grid-template-columns:1fr;} }

/* ---- Agenda view ---- */
.cal-agenda-list{display:flex; flex-direction:column; gap:10px;}
.cal-agenda-row{
  display:flex; align-items:flex-start; gap:14px; padding:14px 16px; border-radius:14px; border:1.5px solid var(--line);
  background:var(--paper-raised); cursor:pointer; text-align:left; width:100%; text-decoration:none; color:inherit;
  transition:background .15s, transform .15s, box-shadow .15s;
}
.cal-agenda-row:hover{background:var(--blush); transform:translateX(3px); box-shadow:var(--shadow-1);}
.cal-days-away{background:var(--red-wash); color:var(--red-strong);}
.cal-agenda-date{flex:0 0 68px; font-weight:800; color:var(--ink); font-size:.9rem; line-height:1.3;}
.cal-agenda-date small{display:block; font-weight:700; color:var(--ink-faint); font-size:.68rem; text-transform:uppercase;}
.cal-agenda-main{flex:1;}
.cal-agenda-title{font-weight:700; color:var(--ink);}
.cal-agenda-meta{display:flex; flex-wrap:wrap; gap:8px; margin-top:5px; align-items:center;}
.cal-tag-pill{display:inline-flex; align-items:center; gap:5px; font-size:.68rem; font-weight:700; padding:.25em .7em; border-radius:999px; background:var(--blush); color:var(--ink-soft);}
.cal-tag-pill .dot{width:7px; height:7px; border-radius:50%;}
.cal-empty-note{color:var(--ink-faint); font-style:italic; padding:20px 0;}

/* ---- Upcoming / Reflection / Varies sections ---- */
.cal-upcoming-list{display:flex; flex-direction:column; gap:10px;}
.reflection-card{
  background:linear-gradient(155deg, var(--blush) 0%, var(--sand) 100%); border-radius:20px; padding:clamp(24px,4vw,36px);
  border:1px solid var(--line);
}
.reflection-card .eyebrow{color:var(--red-strong);}
.reflection-card p.pull{margin-top:12px;}
.varies-list{display:flex; flex-direction:column; gap:10px;}
.varies-row{display:flex; align-items:flex-start; gap:12px; padding:14px 16px; border-radius:14px; border:1.5px dashed var(--line); background:var(--paper-raised);}
.varies-row .dot{width:9px; height:9px; border-radius:50%; margin-top:6px; flex-shrink:0;}
.varies-row h4{font-size:.95rem;}
.varies-row p{color:var(--ink-soft); font-size:.85rem; margin-top:4px;}

/* ---- Event modal ---- */
.cal-modal-overlay{
  position:fixed; inset:0; background:rgba(1,1,1,.55); z-index:998; display:flex; align-items:center; justify-content:center;
  padding:20px; opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.cal-modal-overlay.open{opacity:1; pointer-events:auto;}
.cal-modal{
  background:var(--paper-raised); border-radius:22px; max-width:560px; width:100%; max-height:88vh; overflow-y:auto;
  padding:clamp(26px,4vw,38px); position:relative; box-shadow:0 30px 70px rgba(0,0,0,.35);
}
.cal-modal-close{
  position:absolute; top:18px; right:18px; width:38px; height:38px; border-radius:50%; border:1.5px solid var(--line);
  background:var(--paper-raised); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:1.1rem; color:var(--ink);
}
.cal-modal-cat{display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; padding:.35em .8em; border-radius:999px;}
.cal-modal h3{margin-top:14px; font-size:clamp(1.2rem,2.4vw,1.5rem);}
.cal-modal-date{color:var(--ink-soft); font-weight:700; margin-top:6px; font-size:.9rem;}
.cal-modal-kind{color:var(--ink-faint); font-size:.78rem; margin-top:2px; text-transform:uppercase; letter-spacing:.04em; font-weight:700;}
.cal-modal-section{margin-top:18px;}
.cal-modal-section strong{display:block; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint); margin-bottom:5px;}
.cal-modal-section p{color:var(--ink-soft); font-size:.95rem; line-height:1.6;}
.cal-modal-source{display:inline-block; margin-top:18px; font-weight:700; color:var(--red-strong); text-decoration:underline; text-underline-offset:3px;}
.cal-add-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:24px;}
.cal-add-row .btn{font-size:.82rem; padding:.6em 1.1em;}

/* ---- Admin ---- */
.admin-toggle{
  position:fixed; bottom:24px; left:24px; z-index:200; background:var(--ink); color:#fff; border:0; border-radius:999px;
  padding:.6em 1.2em; font-size:.78rem; font-weight:700; cursor:pointer; opacity:.55; transition:opacity .2s;
}
.admin-toggle:hover{opacity:1;}
.admin-panel-overlay{
  position:fixed; inset:0; background:rgba(1,1,1,.6); z-index:997; display:flex; align-items:flex-start; justify-content:center;
  padding:40px 20px; overflow-y:auto; opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.admin-panel-overlay.open{opacity:1; pointer-events:auto;}
.admin-panel{background:var(--paper-raised); border-radius:22px; max-width:640px; width:100%; padding:clamp(24px,4vw,36px); position:relative;}
.admin-panel .cal-modal-close{position:absolute; top:18px; right:18px;}
.admin-note{background:var(--red-wash); color:var(--ink); border-radius:12px; padding:12px 14px; font-size:.8rem; margin-top:14px; line-height:1.5;}
.admin-field{margin-top:14px; display:flex; flex-direction:column; gap:6px;}
.admin-field label{font-size:.78rem; font-weight:700; color:var(--ink-soft);}
.admin-field input, .admin-field select, .admin-field textarea{
  padding:.65em .9em; border-radius:10px; border:1.5px solid var(--line); background:var(--paper); color:var(--ink); font:inherit;
}
.admin-field textarea{min-height:70px; resize:vertical;}
.admin-row-2{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
@media (max-width:520px){ .admin-row-2{grid-template-columns:1fr;} }
.admin-list{margin-top:22px; display:flex; flex-direction:column; gap:8px; max-height:220px; overflow-y:auto;}
.admin-list-row{display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:10px; border:1px solid var(--line); font-size:.82rem;}
.admin-list-row .status-pill{font-size:.65rem; font-weight:800; text-transform:uppercase; padding:.2em .6em; border-radius:999px; background:var(--blush);}
.admin-list-row .status-pill.published{background:var(--green-wash); color:var(--green-deep);}
.admin-list-row button{border:0; background:none; cursor:pointer; font-size:.78rem; font-weight:700; color:var(--red-strong);}
