/* Deep Focus Daily — free tools (planner, pomodoro). Uses the theme tokens from style.css. */
.dfd-tool {
  --cat-deep: #c5943b;
  --cat-shallow: #7f9fc4;
  --cat-meeting: #c98585;
  --cat-break: #7fb89c;
  --cat-personal: #b0aaa0;
  --cat-text: #0a0f1c;
  border: 1px solid var(--border);
  border-top: 3px solid var(--accent);
  background: var(--bg-card);
  padding: 20px;
  margin: 0 0 40px;
  font-family: 'Literata', Georgia, serif;
  color: var(--text);
}
.dfd-tool *, .dfd-tool *::before, .dfd-tool *::after { border-radius: 0; box-sizing: border-box; }
.dfd-tool input,
.dfd-tool select {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  padding: 7px 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  max-width: 100%;
}
.dfd-tool :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.dfd-tool label { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); display: inline-flex; flex-direction: column; gap: 4px; }
.dfd-tool .cat-deep { --cat: var(--cat-deep); }
.dfd-tool .cat-shallow { --cat: var(--cat-shallow); }
.dfd-tool .cat-meeting { --cat: var(--cat-meeting); }
.dfd-tool .cat-break { --cat: var(--cat-break); }
.dfd-tool .cat-personal { --cat: var(--cat-personal); }

/* Planner */
.planner-toolbar, .planner-form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 16px; }
.planner-toolbar-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.planner-form { padding: 14px; border: 1px solid var(--border); }
.planner-form-label { flex: 1 1 200px; }
.planner-form-label input { width: 100%; }
.planner-error { flex-basis: 100%; margin: 0; color: #b3402f; font-size: 14px; min-height: 1px; }
html[data-theme="dark"] .planner-error { color: #f0a090; }
.planner-confirm { padding: 10px 14px; border: 1px solid var(--accent); margin-bottom: 16px; font-size: 14px; }
.planner-print-title { display: none; }
.planner-grid {
  position: relative;
  margin-left: 52px;
  border-left: 1px solid var(--border);
  background-image: repeating-linear-gradient(to bottom, var(--border) 0 1px, transparent 1px var(--row));
}
.planner-hour { position: absolute; left: -52px; width: 46px; transform: translateY(-50%); font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--text-muted); text-align: right; }
.planner-hour:first-child { transform: none; }
.dfd-tool .planner-block {
  position: absolute;
  left: 6px;
  right: 6px;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1.3;
}
.planner-block-time { font-weight: 700; }
.planner-list-title { font-size: 18px; margin: 28px 0 10px; }
.planner-list { list-style: none; margin: 0; padding: 0; }
.planner-list li { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; padding: 8px 0 8px 12px; border-bottom: 1px solid var(--border); border-left: 6px solid var(--cat, transparent); }
.planner-list-time { font-family: 'JetBrains Mono', monospace; font-size: 12px; min-width: 92px; }
.planner-list-label { flex: 1 1 160px; min-width: 0; overflow-wrap: anywhere; }
.planner-list-label small { color: var(--text-muted); font-size: 12px; }
.planner-list-actions { display: flex; gap: 6px; }
.planner-empty { color: var(--text-muted); border-left: none !important; }

/* Pomodoro */
.pomo-display { text-align: center; padding: 12px 0 20px; }
.pomo-phase { font-family: 'JetBrains Mono', monospace; font-size: 12px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--accent); margin: 0; }
.pomo-time { font-family: 'JetBrains Mono', monospace; font-size: clamp(56px, 18vw, 112px); line-height: 1.1; margin: 8px 0; font-variant-numeric: tabular-nums; }
.dfd-tool[data-phase="short"] .pomo-time, .dfd-tool[data-phase="long"] .pomo-time { color: var(--text-muted); }
.pomo-cycles { font-size: 14px; color: var(--text-muted); margin: 0; }
.pomo-controls { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.dfd-tool .pomo-primary { min-width: 120px; }
.pomo-settings { border: 1px solid var(--border); padding: 14px; display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.pomo-settings legend { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; padding: 0 6px; }
.pomo-settings label { flex: 1 1 120px; }
.pomo-settings input[type="number"] { width: 100%; }
.dfd-tool .pomo-sound { flex-direction: row; align-items: center; flex-basis: 100%; text-transform: none; letter-spacing: 0; font-size: 13px; }
.dfd-tool .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@media (max-width: 639px) {
  .dfd-tool { padding: 14px; margin-left: -8px; margin-right: -8px; }
  .planner-toolbar-actions { margin-left: 0; }
  .planner-list-actions { flex-basis: 100%; flex-wrap: wrap; }
  .planner-list-time { min-width: 0; }
  .planner-toolbar label, .planner-form label { flex: 1 1 130px; }
  .planner-toolbar input, .planner-toolbar select, .planner-form select { width: 100%; }
}

@media print {
  .site-header, .site-footer, .site-sidebar, .ad-slot, #wpadminbar, .cmplz-cookiebanner,
  .planner-toolbar, .planner-form, .planner-confirm, .planner-status, .planner-list-title, .planner-list,
  .tool-page-content, .tool-page-intro, .home-intro, .home-section { display: none !important; }
  body, .dfd-tool { background: #fff !important; color: #000 !important; }
  .dfd-tool { border: 1px solid #000; }
  .planner-print-title { display: block; font-size: 18px; margin-bottom: 12px; }
  .planner-grid { background-image: repeating-linear-gradient(to bottom, #999 0 1px, transparent 1px var(--row)); }
}

/* Buttons. The Customizer CSS styles every button with !important at specificity (0,2,1),
   so tool buttons are scoped by id. Add each new tool's id (dfd-<key>) to this list. */
:is(#dfd-planner, #dfd-pomodoro, #dfd-time-audit, #dfd-weekly-review, #dfd-obsidian-vault) {
  & button {
    border: 1px solid var(--border) !important;
    background-color: var(--bg) !important;
    color: var(--text) !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    padding: 7px 10px !important;
    box-shadow: none !important;
    cursor: pointer;
  }
  & button:hover, & button:focus-visible { border-color: var(--accent) !important; background-color: var(--bg) !important; color: var(--accent) !important; }
  & .planner-list-actions button { padding: 5px 8px !important; line-height: 1.2; }
  & .planner-save, & .pomo-primary,
  & .planner-save:hover, & .pomo-primary:hover,
  & .planner-save:focus-visible, & .pomo-primary:focus-visible { background-color: var(--accent) !important; border-color: var(--accent) !important; color: #0a0f1c !important; }
  & .planner-block, & .planner-block:hover, & .planner-block:focus-visible {
    background-color: var(--cat) !important;
    color: var(--cat-text) !important;
    border: 1px solid rgba(10, 15, 28, 0.35) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    padding: 2px 8px !important;
  }
  & .planner-block:hover, & .planner-block:focus-visible { filter: brightness(1.08); }
  @media print {
    & .planner-block { background-color: #fff !important; color: #000 !important; border: 1px solid #000 !important; }
  }
}

.planner-status { margin: 0 0 12px; font-size: 14px; color: var(--text-muted); }
.planner-list-title:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
.pomo-sound-hint { text-align: center; font-size: 13px; color: var(--text-muted); margin: -12px 0 20px; }