/* Eseme töökaart (#/tooglaud/ese/<id>) — hele tööriistavaade, juuksepiirid, tihe info.
   Ainult disainisüsteemi tokenid: värvi-literaale ega varje siin ei ole. */
.ese.section { padding-block: var(--space-5) var(--space-8); }
.ese [hidden] { display: none !important; }

.ese-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); font-size: var(--fs-sm); color: var(--color-text-muted); }
.ese-crumbs a { color: var(--color-text-soft); }

.ese-header { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: var(--space-4); align-items: center; margin: var(--space-4) 0 var(--space-4); padding-bottom: var(--space-4); border-bottom: 1px solid var(--color-border); }
.ese-header__body { display: grid; gap: var(--space-1); min-width: 0; }
.ese-header .eyebrow { margin: 0; }
.ese-header h1 { margin: 0; font-size: var(--fs-3xl); }
.ese-header__title { margin: 0; color: var(--color-text-soft); }
.ese-header__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); margin-top: var(--space-1); }
.ese-header__photo .photo { border-radius: var(--radius-md); }
.ese-rate { font-size: var(--fs-sm); color: var(--color-text-muted); }
.ese-rate strong { color: var(--color-text); font-weight: var(--fw-semibold); }
.ese .ops-lux-tag { color: var(--status-2-fg); border-color: var(--status-2-border); background: var(--status-2-bg); }

.ese-stepper { margin-bottom: var(--space-5); }
.ese-side { margin-bottom: var(--space-5); }
.ese-flash { margin-bottom: var(--space-5); }

.ese-layout { display: grid; gap: var(--space-5); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) {
  .ese-layout { grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); align-items: start; }

}
.ese-main { gap: var(--space-4); }
.ese-card { padding: var(--space-4) var(--space-5); border-radius: var(--radius-md); }
.ese-card > .card__title { font-size: var(--fs-md); padding-bottom: var(--space-3); margin-bottom: var(--space-3); border-bottom: 1px solid var(--color-border); }

/* Andmeloend: tihe võti–väärtus, horisontaalsed juuksepiirid */
.ese-dl { grid-template-columns: minmax(8rem, max-content) minmax(0, 1fr); gap: 0 var(--space-5); }
.ese-dl dt, .ese-dl dd { padding: var(--space-2) 0; border-bottom: 1px solid var(--color-border); }
.ese-dl dt:last-of-type, .ese-dl dd:last-of-type { border-bottom: 0; }
.ese-dl dd { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); overflow-wrap: anywhere; }

/* Tegevused */
.ese-actions { gap: var(--space-3); }
.ese-actions__title { font-size: var(--fs-xs); font-weight: var(--fw-medium); letter-spacing: var(--ls-caps); text-transform: uppercase; color: var(--color-text-muted); margin: 0; }
.ese-action { display: grid; gap: var(--space-3); padding: var(--space-4); border-radius: var(--radius-md); }
.ese-action .card__title { margin: 0; font-size: var(--fs-md); }
.ese-action .fieldset { display: grid; gap: var(--space-2); }
.ese-action .form-actions { margin-top: var(--space-1); padding-top: 0; border-top: 0; }
.ese-history .timeline__desc { white-space: pre-line; }

.ese-platform { border: 0; margin: 0; padding: 0; min-width: 0; }
.ese-platform > legend { padding: 0; margin-bottom: var(--space-2); }
.ese-edit { margin-top: var(--space-4); }
.ese-edit > summary { list-style: none; cursor: pointer; display: inline-flex; }
.ese-edit > summary::-webkit-details-marker { display: none; }
.ese-edit[open] > summary { margin-bottom: var(--space-4); }
.ese-edit__form { display: grid; gap: var(--space-3); }
.ese-edit__grid { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }

@media (max-width: 899px) {
  /* Mobiilis on operaatori järgmine tegevus esimene asi pärast päist. */
  .ese-actions { order: -1; }
}
@media (max-width: 479px) {
  .ese-header { grid-template-columns: 56px minmax(0, 1fr); gap: var(--space-3); }
  .ese-dl { grid-template-columns: minmax(6.5rem, 34%) minmax(0, 1fr); gap: 0 var(--space-3); font-size: var(--fs-sm); }
  .ese-dl dt { color: var(--color-text-muted); }
}
