/* Additions for the English interface and CSV import.
   The supplied style.css remains unchanged and owns the original visual design. */
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
button, summary { cursor: pointer; }
button {
  padding: 12px 18px;
  color: var(--accent);
  background: var(--surface);
  border: 1px solid var(--accent);
  border-radius: 8px;
}
button:hover:not(:disabled) { background: #e5eddf; }
button:disabled { cursor: default; opacity: 0.7; }
button.primary { color: white; background: var(--accent); }
button.primary:hover:not(:disabled) { background: #284632; }
a { color: var(--accent); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.header-inner > p:last-child { max-width: 60ch; color: var(--muted); }
.menu-icon { font-size: 2rem; line-height: 1; color: var(--accent); }
.card-link { margin-top: auto; padding-top: 12px; font-weight: 600; color: var(--accent); }
.local-note, .hint { color: var(--muted); font-size: 0.9rem; }
.local-note { margin-block: 24px; }

/* Import and search share the original rounded cards and form controls. */
.import-panel {
  margin-block: 24px;
  padding: 20px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}
.import-panel > summary { font-weight: 700; color: var(--accent); }
.import-panel input { display: block; max-width: 100%; margin-top: 8px; }
.filters {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  margin-block: 24px 12px;
}
.filters label { font-weight: 600; min-width: 0; }
.filters input, .filters select {
  display: block;
  width: 100%;
  min-width: 0;
  margin-top: 8px;
  padding: 12px;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.filter-actions, .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-block: 16px; }
.filter-actions > label { margin-right: auto; }
input[type="checkbox"] { accent-color: var(--accent); }
.table-scroll { overflow-x: auto; max-width: 100%; }
table { width: 100%; border-collapse: collapse; text-align: left; }
th, td { padding: 10px; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
caption { padding-block: 10px; text-align: left; font-weight: 600; }

/* Generated plant cards use the same visual/content structure as the original. */
.plant-card { min-width: 0; overflow-wrap: anywhere; }
.plant-content .badge { margin-bottom: 12px; }
.botanical { margin: 0 0 20px; font-style: italic; color: var(--muted); }
.badge { display: inline-block; padding: 3px 8px; border-radius: 6px; font-size: 0.8rem; color: #775a23; background: #fff2d4; }
.badge.verified { color: var(--accent); background: #e5eddf; }
.empty-state { grid-column: 1 / -1; padding: 24px; border: 1px dashed var(--border); border-radius: 12px; color: var(--muted); }
.garden-item > label, .task-details { flex-basis: 100%; min-width: 0; }
.task-details > summary { font-weight: 600; color: var(--accent); }
.garden-item span { overflow-wrap: anywhere; }
.garden-item.flex { flex-wrap: nowrap; }
.garden-item.flex button { flex-shrink: 0; }

/* Existing learning styles applied to the English section markup. */
.learning-list { display: grid; gap: 12px; }
.learning-list > details { overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
.learning-list > details > summary { padding: 20px; color: var(--accent); font-size: 1.1rem; font-weight: 700; }
.learning-list > details > summary:hover { background: #e5eddf; }
.learning-list > details > summary:focus-visible { outline-offset: -4px; }
.learning-list > details[open] > summary { border-bottom: 1px solid var(--border); }
.learning-list > details > p { margin: 20px; }
.learning-list > details > button { margin: 0 20px 20px; max-width: calc(100% - 40px); }
.reading { max-width: 75ch; }
.reading h3 { margin-top: 24px; font-size: 1.15rem; }
.reading li { margin-bottom: 8px; }
#storage-warning, .error { padding: 12px; color: #8a3025; background: #fff0eb; border-radius: 8px; }
footer { padding: 24px 16px; border-top: 1px solid var(--border); color: var(--muted); text-align: center; font-size: 0.9rem; }
.skip-link { position: absolute; top: -100px; left: 16px; z-index: 10; padding: 12px; background: var(--surface); }
.skip-link:focus { top: 16px; }
@media (min-width: 650px) {
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
  .filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
  .filter-actions > label { width: 100%; }
  .plant-facts > div { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); }
  .garden-item.flex { align-items: flex-start; }
  #csv-file { font-size: 0.85rem; }
}

/* Learning library follows the existing garden palette. */
.learn-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:16px; margin-block:24px; }
.learn-card { padding:22px; background:var(--surface); border:1px solid var(--border); border-radius:12px; min-width:0; overflow-wrap:anywhere; }
.learn-card h3 { margin-top:0; font-size:1.15rem; }
.learn-card button { text-align:left; }
.learn-card .eyebrow { font-size:0.75rem; }
.learn-filters { grid-template-columns: minmax(0,2fr) minmax(0,1fr); }
.article-intro { font-size:1.2rem; }
#learn-article { margin-inline:auto; overflow-wrap:anywhere; }
#learn-article h2 { font-size:clamp(1.6rem,4vw,2.2rem); }
@media(max-width:650px) { .learn-filters { grid-template-columns:1fr; } }

/* Dated garden journal */
.note-composer,.note-entry {background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px;margin-block:20px;min-width:0;}
.note-composer fieldset {border:0;padding:0;margin:0;min-width:0;}
.note-composer legend {font-size:1.2rem;font-weight:700;margin-bottom:16px;}
.note-composer label {display:block;font-weight:600;margin-top:14px;}
.note-composer input:not([type=file]), #notes-search {display:block;width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);margin-block:8px 14px;}
#note-photos {max-width:100%;}
.note-photo-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px;margin-block:16px;}
.note-photo-grid:empty {display:none;}
.note-photo-grid img {display:block;width:100%;height:180px;object-fit:cover;border-radius:10px;}
.note-photo button {margin-top:8px;}
.note-entry h4 {font-size:1.2rem;margin:0 0 8px;overflow-wrap:anywhere;}
.note-body {white-space:pre-wrap;overflow-wrap:anywhere;}
.note-location {font-weight:600;color:var(--accent);overflow-wrap:anywhere;}
.journal-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:32px;}
@media(max-width:450px){.note-composer,.note-entry{padding:16px}.note-composer .actions button{width:100%}}

/* Observation follow-ups */
.note-composer select, .note-composer input[type=date], #followup-filter {display:block;width:100%;box-sizing:border-box;padding:12px;margin-block:8px 14px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);}
.reminder-editor {margin-top:24px;padding:16px;background:#f0f4ec;border-radius:12px;}
.note-composer input[type=checkbox] {display:inline-block;width:auto;margin-right:8px;}
.followup-section {margin-block:24px 36px;}
.note-entry:focus {outline:3px solid var(--accent);outline-offset:3px;}

/* Garden areas, structures and location-aware records */
.space-form {display:grid;gap:10px;max-width:850px;}
.space-form > label {font-weight:600;margin-top:8px;}
.space-form input:not([type=hidden]),.space-form textarea,.space-form select,#task-location-filter,#notes-location-filter,#note-target {display:block;width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font:inherit;}
#task-location-filter,#notes-location-filter {margin-block:8px 20px;}
.plant-placement {padding:20px 0;border-top:1px solid var(--border);}
.plant-placement label {display:block;font-weight:600;}
.plant-placement select {display:block;width:100%;padding:8px;margin-block:12px;border:1px solid var(--border);border-radius:8px;}
.plant-placement button {margin:4px 8px 4px 0;}
#spaces-status {color:var(--accent);font-weight:600;}
#space-cards .learn-card p {white-space:pre-wrap;}
/* Start with a plant type; reveal the detailed search after selection. */
.plant-type-menu { display: grid; grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); gap: 12px; margin-block: 24px 16px; }
.plant-type-menu button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 130px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); }
.plant-type-menu button > span { font-size: 2rem; }
[data-plant-type][aria-pressed="true"] { background: #e5eddf; border-color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent); }
#plant-search-stage { margin-top: 24px; }
.plant-content { position: relative; }
.plant-content .badge { max-width: calc(100% - 54px); }
.favourite-button { position: absolute; right: 16px; top: 16px; min-width: 44px; min-height: 44px; padding: 4px 10px; font-size: 1.6rem; line-height: 1; border-radius: 50%; }
.favourite-button[aria-pressed="true"] { color: #8c3047; background: #fff0f3; border-color: #8c3047; }
@media (max-width: 360px) { .plant-type-menu { grid-template-columns: repeat(2,minmax(0,1fr)); } }

.researched-facts{border-top:1px solid #d7dfd5;padding-top:1rem}.evidence-status,.evidence-scope{display:block;font-size:.75rem;color:#52604f;margin-top:.25rem}.researched-facts a{display:inline-block;font-size:.8rem;margin-right:.6rem}.researched-facts dd{overflow-wrap:anywhere}

/* Plant profiles use their own view, keeping the results grid compact. */
button.plant-visual { width: 100%; border: 0; border-radius: 0; }
button.plant-visual:focus-visible { outline-offset: -5px; }
.plant-more-details { width: 100%; margin-top: 16px; min-height: 44px; }
.plant-profile { max-width: 760px; margin-inline: auto; }
#plant-profile-back { min-height: 44px; margin-bottom: 24px; }
#plant-profile-content { padding: clamp(16px, 4vw, 32px); border: 1px solid var(--border); border-radius: 18px; background: var(--surface); overflow-wrap: anywhere; }
.plant-profile h2 { margin-bottom: 8px; }
.plant-profile-actions { margin-block: 24px; }
.plant-profile-actions button { min-height: 44px; max-width: 100%; }
.plant-profile .plant-facts > div { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.plant-profile .researched-facts > div { grid-template-columns: 1fr; gap: 6px; padding-block: 16px; }
.plant-profile dd { min-width: 0; }
.plant-profile .researched-facts a { padding-block: 10px; }
@media (max-width: 480px) {
 .plant-profile-actions { display: grid; grid-template-columns: 1fr; }
 .plant-profile .plant-facts > div { grid-template-columns: 1fr; gap: 4px; }
}

.plant-sources { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.plant-sources ul { padding-left: 20px; margin-bottom: 0; }
.plant-sources a { display: inline-block; padding-block: 10px; overflow-wrap: anywhere; }

/* Local plant photos; placeholders remain when no image file is present. */
button.plant-visual { padding: 0; height: 220px; overflow: hidden; }
.plant-visual img { display: block; width: 100%; height: 220px; object-fit: cover; }
.plant-profile-image { display: grid; place-items: center; min-height: 180px; background: #e5eddf; border-radius: 12px; overflow: hidden; margin-block: 20px; }
.plant-profile-image img { display: block; max-width: 100%; max-height: 520px; width: auto; height: auto; object-fit: contain; }
.plant-profile-image .plant-image-placeholder { font-size: 4rem; padding-block: 36px; }

.plant-visual { position: relative; }
.plant-visual img { position: absolute; inset: 0; }
.plant-photo.is-loading { opacity: 0; }

/* Task scheduling, accessible confirmations and completion history. */
.month-options { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-block:16px; }
.month-options label { display:flex; gap:8px; align-items:center; }
#space-task-form input[type=checkbox] { width:auto; }
.action-feedback:not(:empty), .task-inline-feedback:not(:empty) { padding:12px; border-radius:8px; background:#e2f3e7; color:#174b2a; }
.action-feedback.error, .task-toast.error { background:#fff0ed; color:#842818; }
.task-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 32px); padding:16px 20px; border-radius:12px; background:#174b2a; color:white; box-shadow:0 4px 20px #0003; z-index:1000; pointer-events:none; }
.task-toast[hidden] { display:none; }
.task-success { animation:task-success 650ms ease-out; }
.history-entry { padding:16px; margin-block:12px; border:1px solid var(--border); border-radius:10px; }
@keyframes task-success { from { box-shadow:0 0 0 5px #4b9d65; } to { box-shadow:0 0 0 0 transparent; } }
@media(prefers-reduced-motion:reduce) { .task-success { animation:none; } }
@media(max-width:480px) { .month-options { grid-template-columns:repeat(3,1fr); } }

#space-task-panel { width:min(560px,calc(100vw - 32px)); max-height:85dvh; box-sizing:border-box; overflow:auto; border:1px solid var(--border); border-radius:18px; padding:24px; color:inherit; }
#space-task-panel::backdrop { background:rgb(15 30 20 / .5); }
.task-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.task-dialog-header h2 { margin:0; }
#close-task-dialog { min-width:44px; min-height:44px; font-size:24px; }
#task-more-options { margin-block:20px; }
#task-more-options summary { cursor:pointer; padding-block:12px; }
.task-global-feedback:not(:empty) { background:#e2f3e7; color:#174b2a; padding:16px; margin:12px auto; max-width:900px; border-radius:10px; }
#task-global-view { margin:0 auto 16px; display:block; }
#task-global-view[hidden] { display:none; }
@media(max-width:600px) { #space-task-panel { width:100%; max-height:90dvh; margin:auto 0 0; border-radius:18px 18px 0 0; padding:20px; } }

.garden-tasks-section { margin-block:24px; padding-block:20px; border-block:1px solid var(--border); }

#note-dialog { width:min(620px,calc(100vw - 24px)); max-height:90dvh; overflow:auto; border:1px solid var(--border); border-radius:16px; padding:20px; color:inherit; }
#note-dialog::backdrop { background:rgb(15 30 20 / .5); }
#close-note-dialog { float:right; min-width:44px; min-height:44px; }
#note-dialog .note-composer { border:0; padding:0; }
#today-content { margin-block:20px; }
.timeline-photo { max-width:150px; max-height:150px; object-fit:cover; border-radius:8px; margin:8px; }
@media(max-width:600px) { #note-dialog { width:100%; box-sizing:border-box; margin:auto 0 0; border-radius:18px 18px 0 0; } }

#garden-profile-form input[type="checkbox"] { width:auto; }

#seasonal-review { width:min(600px,calc(100vw - 24px)); max-height:90dvh; overflow:auto; border:1px solid var(--border); border-radius:16px; padding:24px; box-sizing:border-box; }
#seasonal-review::backdrop { background:rgb(15 30 20 / .5); }
#seasonal-review-checks label { display:flex; align-items:flex-start; gap:10px; margin-block:16px; }
#seasonal-review-checks input { width:auto; flex:none; margin-top:6px; }
#seasonal-list .actions { margin-top:16px; }
@media(max-width:600px) { #seasonal-review { width:100%; margin:auto 0 0; border-radius:18px 18px 0 0; } }
.personal-plant-dialog{width:min(560px,calc(100vw - 32px));max-height:90dvh;overflow:auto;border:1px solid #b6c8b1;border-radius:16px;padding:24px;box-sizing:border-box}.personal-plant-dialog::backdrop{background:#10261999}.personal-plant-dialog label{display:block;margin:14px 0}.personal-plant-dialog input:not([type=file]),.personal-plant-dialog select,.personal-plant-dialog textarea{display:block;width:100%;box-sizing:border-box;padding:10px;font:inherit}.personal-plant-dialog img{max-width:100%;max-height:220px;border-radius:10px}.personal-thumb{width:90px;height:90px;object-fit:cover;border-radius:10px}.garden-item{flex-wrap:wrap;gap:10px}.personal-note{flex-basis:100%;white-space:pre-wrap}#personal-error{color:#704220}
.garden-active .page-header{display:none}.cover-section-label{font-size:1rem;font-weight:500;margin-bottom:12px}.garden-cover{background:#fff;border:1px solid #dce4d5;border-radius:18px;overflow:hidden;margin:12px 0 24px}.garden-cover-frame{aspect-ratio:3/1;position:relative;overflow:hidden;background:linear-gradient(125deg,#e2eacf,#b7cab1)}.garden-cover-frame img,.cover-preview img{width:100%;height:100%;object-fit:cover;display:block}.garden-cover-frame img[hidden],#garden-cover-placeholder[hidden]{display:none}.garden-cover-frame #garden-cover-placeholder{height:100%;display:grid;place-items:center;font-size:64px;opacity:.5}.garden-cover-copy{padding:18px 22px 4px}.garden-cover-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.garden-cover-heading h2{margin:0;overflow-wrap:anywhere}.garden-cover-heading button{font-size:.85rem}.garden-cover-copy p{white-space:pre-wrap;overflow-wrap:anywhere}.garden-cover-actions{padding:8px 22px 22px;display:flex;flex-wrap:wrap;gap:8px}.cover-dialog{box-sizing:border-box;width:min(620px,calc(100vw - 24px));max-height:92dvh;overflow:auto;border:1px solid #a7bfa3;border-radius:16px;padding:22px}.cover-dialog::backdrop{background:#13291899}.cover-dialog label{display:block;margin:14px 0}.cover-dialog input,.cover-dialog textarea{box-sizing:border-box;width:100%;display:block;font:inherit}.cover-dialog input:not([type=range]):not([type=file]),.cover-dialog textarea{padding:10px}.cover-dialog input[type=range]{min-height:36px}.cover-preview{overflow:hidden;background:#e2eacf;border-radius:10px}.cover-preview-wide{aspect-ratio:3/1}.cover-preview-phone{aspect-ratio:16/9;max-width:340px}.cover-dialog .actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}@media(max-width:600px){.garden-cover-frame{aspect-ratio:16/9}.garden-cover-copy{padding:16px 16px 4px}.garden-cover-actions{padding:8px 16px 16px}.garden-cover-heading h2{font-size:1.4rem}}

/* Personal plant navigation and feedback. */
.plant-markers{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-bottom:8px;min-height:44px}
.plant-markers .favourite-button{position:static}
.in-garden-star{display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:36px;color:#805600;background:#fff1c7;border:1px solid #ddc37b;border-radius:999px;padding:4px 9px;font-size:1.1rem;font-weight:700}
.plant-save-toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;align-items:center;gap:12px;max-width:min(680px,calc(100% - 24px));width:max-content;box-sizing:border-box;padding:14px 18px;background:#173d2b;color:white;border-radius:14px;box-shadow:0 6px 24px #0003;flex-wrap:wrap}
.plant-save-toast[hidden]{display:none}
.plant-save-toast button{background:#fff;color:#173d2b;min-height:44px}
.my-plants-link{width:100%;margin:18px 0;text-align:left}
#my-plants-search{max-width:560px;width:100%;box-sizing:border-box;margin:8px 0 16px}
#my-plants-view [aria-pressed=true]{background:#214e36;color:white}
#my-plants-view [hidden]{display:none!important}
#my-plants-view{padding-bottom:120px}
@media(max-width:480px){.plant-save-toast{bottom:12px;padding:12px;gap:8px}.plant-save-toast span{flex-basis:100%}}

/* Short task-side practical guidance. */
.task-details h4{margin:1.1rem 0 .4rem;font-size:1rem}.practical-steps{padding-left:1.5rem}.practical-steps li{padding:.25rem 0 .6rem .25rem;line-height:1.6}.practical-source{margin-top:1rem}.practical-source summary{font-size:.9rem}dialog .practical-learn-link{display:none}

/* Remote reference photos retain their full framing. */
.plant-visual img.remote-plant-photo { object-fit: contain; background: #e5eddf; }
.plant-photo-credit { margin: 0 0 12px; font-size: .76rem; line-height: 1.5; color: #425949; overflow-wrap: anywhere; }
.plant-photo-credit summary { cursor: pointer; padding-block: 5px; }
.plant-photo-credit a { color: inherit; text-decoration: underline; }
.plant-photo-credit p { margin: 5px 0; }
.plant-photo-unavailable { display: block; padding: 24px; font-size: .9rem; color: #425949; }

.task-calendar { margin:24px 0; padding:20px; background:#f6f8f2; border:1px solid #cbd7c6; border-radius:16px; }
.calendar-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.calendar-toolbar h4 { margin:0; min-width:150px; text-align:center; font-size:1.2rem; }
.calendar-toolbar label { margin-left:auto; }
.calendar-weekdays,.calendar-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; }
.calendar-weekdays { text-align:center; margin:16px 0 6px; font-size:.85rem; }
button.calendar-day { min-width:0; min-height:94px; padding:8px 4px; border:1px solid #cfdbca; border-radius:8px; background:white; color:#24432d; display:flex; flex-direction:column; align-items:center; gap:4px; }
button.calendar-day[aria-current=date] { outline:2px solid #355c43; outline-offset:-3px; }
button.calendar-day[aria-pressed=true] { background:#355c43; color:white; }
.calendar-day-number { font-weight:bold; }.calendar-count { font-size:.73rem; }.calendar-preview { font-size:.7rem; width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
button.calendar-day.has-overdue { border-bottom:4px solid #ae4834; }
button.calendar-day.all-complete { border-bottom:4px solid #4c8254; }
.calendar-selected { margin-top:20px; border-top:1px solid #cfdbca; padding-top:12px; }
.calendar-task { background:white; padding:14px; margin:12px 0; border-radius:10px; border:1px solid #dce4d7; }
.calendar-task h4 { margin:0 0 6px; }.calendar-task-state { font-size:.85rem; }.task-calendar details>summary { cursor:pointer; padding:12px 0; }
@media(max-width:600px){.task-calendar{padding:10px}.calendar-toolbar{gap:6px}.calendar-toolbar label{width:100%;margin:6px 0}.calendar-toolbar h4{flex:1;min-width:0;font-size:1rem}button.calendar-day{min-height:66px;padding:6px 1px}.calendar-preview{display:none}.calendar-count{font-size:.62rem}.calendar-weekdays{font-size:.7rem}.calendar-days{gap:3px}.calendar-task .actions{display:flex;flex-wrap:wrap}}