/* 1.30.56: shared, translucent event category marks. Untagged events remain unchanged. */
.event-tag-badge { display:inline-flex; align-items:center; max-width:100%; gap:.38rem; padding:.22rem .55rem; border:1px solid rgba(var(--event-tag-rgb),.38); border-radius:5px; background:rgba(var(--event-tag-rgb),.17); color:var(--ink); font-size:.78rem; font-weight:750; line-height:1.5; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; vertical-align:middle; }
.event-tag-badge::before { content:""; display:block; flex:0 0 6px; width:6px; height:6px; border-radius:2px; background:var(--event-tag-color); }
.event-tagged-row { border-left:3px solid rgba(var(--event-tag-rgb),.65) !important; background-image:none !important; }
.event-grid-card.event-tagged-row { padding-left:13px; }
.directions-table tr.event-tagged-row th,.directions-table tr.event-tagged-row td { background-image:linear-gradient(90deg,rgba(var(--event-tag-rgb),.095),rgba(var(--event-tag-rgb),.035)); }
.calendar-event-chip.event-tagged-row { padding-left:4px; border-top-color:rgba(var(--event-tag-rgb),.36); border-bottom-color:rgba(var(--event-tag-rgb),.36); }
.event-tagged-row.calendar-agenda-event,.event-tagged-row.dashboard-event-card { border-left-width:3px; }
.event-workspace-head.is-tagged { border-left:3px solid rgba(var(--event-tag-rgb),.65); background:linear-gradient(90deg,rgba(var(--event-tag-rgb),.07),transparent 65%); }
.event-workspace-head .event-workspace-main .event-tag-badge { margin: 0 0 5px; }
.modal-head:has(.event-tag-badge) .eyebrow { letter-spacing:normal; text-transform:none; }
.event-tag-list { display:grid; gap:10px; margin:12px 0; }
.event-tag-admin-item { display:flex; align-items:center; justify-content:space-between; gap:12px; min-width:0; border:1px solid var(--line); border-radius:10px; padding:12px; }
.event-tag-admin-info { display:grid; min-width:0; gap:5px; }
.event-tag-admin-info small { color:var(--muted); overflow-wrap:anywhere; }
.event-tag-admin-actions { display:flex; gap:7px; flex-shrink:0; }
.event-tag-form-preview { padding:10px; border-radius:8px; border:1px dashed var(--line); margin-top:5px; }
@media(max-width:500px) { .event-tag-admin-item { align-items:flex-start; } .event-tag-admin-actions { flex-direction:column; } .event-tag-badge { font-size:.72rem; } }

/* Public calendar and public event pages use their own light theme. */
#sharedCalendar .event-tag-badge,#sharedEvent .event-tag-badge {color:#213443;font-size:11px; margin-left:7px;}
#sharedCalendar tr.event-tagged-row td {background:linear-gradient(90deg,rgba(var(--event-tag-rgb),.075),rgba(var(--event-tag-rgb),.015));}
#sharedCalendar tr.event-tagged-row td:first-child {border-left:3px solid rgba(var(--event-tag-rgb),.65);}
#sharedEvent .event-head .event-tag-badge {margin:0;}

/* A distinct icon in the administration hub; inherited mask theme colors. */
.tab-icon[data-icon="tag"] { --icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4 13.4 20.6a2 2 0 0 1-2.8 0l-8.2-8.2V3h9.4l8.8 7.6a2 2 0 0 1 0 2.8Z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.5'/%3E%3C/svg%3E"); }
/* The dialog's accessible title is preserved for screen readers. Only the
   small category badge is visible above the main, unique event title. */
.modal-card.modal-event-details .modal-head h3 { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.modal-card.modal-event-details .modal-head .eyebrow { margin:0; }
.event-workspace-head h2.event-workspace-title { font-size:clamp(20px,2vw,26px); line-height:1.15; margin:5px 0 8px; font-weight:800; overflow-wrap:anywhere; }
/* The fourth event filter must stay usable even on narrow phones. */
@media(max-width:680px) {
  [data-panel="events"] .panel-head .toolbar { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; }
  [data-panel="events"] .panel-head .toolbar > .event-view-switch,
  [data-panel="events"] .panel-head .toolbar > .event-calendar-export-button { grid-column:1/-1; }
  [data-panel="events"] .panel-head .toolbar > .event-filter-control { width:100%; max-width:100%; min-width:0; }
  [data-panel="events"] .panel-head .toolbar > .event-filter-control select { min-width:0; max-width:100%; width:100%; }
}
@media(max-width:365px) {
 [data-panel="events"] .panel-head .toolbar > .event-filter-control { font-size:12px; }
}

/* 1.30.59: theme-aware tag surfaces. No dark mask in front of the tag color.
   Opacity is controlled per tag and persisted by the administrator. */
.directions-wrap { --event-team-base: #f8fafc; background: var(--event-team-base); }
:root[data-theme="dark"] .directions-wrap { --event-team-base: #090f1a; }
/* Untagged rows stay visually neutral and the text color always follows the theme. */
:root[data-theme="dark"] .directions-table tbody tr:not(.event-tagged-row) th,
:root[data-theme="dark"] .directions-table tbody tr:not(.event-tagged-row) td { background: #0e1725; }
.directions-table tbody tr.event-tagged-row > th,
.directions-table tbody tr.event-tagged-row > td,
.directions-table tbody tr.event-tagged-row > th.sticky-col {
  background: color-mix(in srgb, var(--event-tag-color) var(--event-tag-strength, 26%), var(--event-team-base)) !important;
  color: var(--cp-text);
  box-shadow: inset 0 1px 0 rgba(var(--event-tag-rgb), .16), inset 0 -1px 0 rgba(var(--event-tag-rgb), .16);
}
.directions-table tbody tr.event-tagged-row > th.sticky-col {
  border-left: 3px solid var(--event-tag-color) !important;
  box-shadow: inset 3px 0 0 var(--event-tag-color), inset 0 1px 0 rgba(var(--event-tag-rgb), .16), inset 0 -1px 0 rgba(var(--event-tag-rgb), .16);
}
.directions-table tr.event-tagged-row { border-left:0 !important; background-image:none !important; }
.directions-table tr.event-tagged-row .direction-event-link,
.directions-table tr.event-tagged-row .direction-primary-assignee { color:var(--cp-text); }
.directions-table tbody tr.event-tagged-row:hover > th,
.directions-table tbody tr.event-tagged-row:hover > td {
  background: color-mix(in srgb, var(--event-tag-color) var(--event-tag-strength, 26%), var(--event-team-base)) !important;
  filter: brightness(1.04);
}
.direction-mobile-card.event-tagged-row {
  background: color-mix(in srgb, var(--event-tag-color) var(--event-tag-soft-strength, 17%), var(--cp-surface)) !important;
  color: var(--cp-text);
  border-left: 3px solid var(--event-tag-color) !important;
  box-shadow: inset 0 1px 0 rgba(var(--event-tag-rgb), .16), 0 1px 9px rgba(8,15,28,.06);
}
.event-grid-card.event-tagged-row,
.calendar-agenda-event.event-tagged-row,
.dashboard-event-card.event-tagged-row {
  background-color: color-mix(in srgb, var(--event-tag-color) var(--event-tag-soft-strength, 17%), var(--cp-surface)) !important;
  color: var(--cp-text);
}
.calendar-event-chip.event-tagged-row {
  background-color: color-mix(in srgb, var(--event-tag-color) var(--event-tag-faint-strength, 10%), var(--cp-surface)) !important;
}
.event-tag-preview-row {
  display:grid; gap:3px; margin-top:10px; padding:12px; border-radius:9px;
  background:color-mix(in srgb, var(--event-tag-color) var(--event-tag-strength, 26%), var(--cp-surface)) !important;
  border-left:3px solid var(--event-tag-color); color:var(--cp-text);
}
.event-tag-preview-row strong {color:inherit;}
.event-tag-preview-row small {color:var(--cp-text-secondary);}
.event-tag-opacity-field input[type="range"] {width:100%; min-height:32px; accent-color:var(--cp-primary); cursor:pointer;}
.event-tag-opacity-field output {font-variant-numeric:tabular-nums; color:var(--cp-primary); font-weight:750;}
.event-calendar-tag-colors-option { display:flex; align-items:flex-start; gap:12px; margin:12px 0; border:1px solid var(--line); border-radius:10px; padding:12px; cursor:pointer; }
.event-calendar-tag-colors-option input {flex-shrink:0; width:18px; height:18px; margin-top:4px; accent-color:var(--accent);}
.event-calendar-tag-colors-option span {display:grid; gap:4px; min-width:0;}
.event-calendar-tag-colors-option strong {font-size:14px;}
.event-calendar-tag-colors-option small {color:var(--muted); line-height:1.5;}
#sharedCalendar tr.event-tagged-row td { background:color-mix(in srgb, var(--event-tag-color) var(--event-tag-soft-strength, 17%), #ffffff) !important; color:#142033; }
#sharedCalendar tr.event-tagged-row td:first-child {border-left:0 !important;}
@media print {
 #sharedCalendar tr.event-tagged-row td {background:color-mix(in srgb, var(--event-tag-color) var(--event-tag-soft-strength, 17%), #ffffff) !important; color:#142033; -webkit-print-color-adjust:exact; print-color-adjust:exact;}
}