/* Everyday admin — small additions on top of Metronic (no build step). */
:root { --ed-green: #02462e; --ed-yellow: #fec700; }

.ed-logo { font-weight: 800; font-size: 1.25rem; letter-spacing: -0.02em; color: var(--ed-green); text-decoration: none; }
.ed-logo span { color: var(--ed-yellow); }
.dark .ed-logo { color: #e8f5ee; }

.ed-auth-bg { background: linear-gradient(160deg, #f4f6f5 0%, #e9f0ec 100%); padding: 16px; }
.dark .ed-auth-bg { background: var(--background); }

.ed-logo-thumb { width: 32px; height: 32px; object-fit: contain; border-radius: 8px; border: 1px solid var(--border); background: #fff; }
.ed-logo-empty { display: inline-flex; align-items: center; justify-content: center; font-weight: 700; color: var(--muted-foreground); }
.ed-logo-preview { width: 64px; height: 64px; object-fit: contain; border-radius: 10px; border: 1px solid var(--border); background: #fff; }

.ed-list { list-style: disc; padding-inline-start: 1.25rem; margin: 0.25rem 0 0; }
.ed-list li + li { margin-top: 0.15rem; }
.ed-disabled { opacity: 0.45; pointer-events: none; }
.ed-invalid { border-color: var(--destructive) !important; }
.ed-strike { text-decoration: line-through; margin-inline-end: 0.35rem; }
.ed-code { display: block; padding: 0.6rem 0.75rem; border-radius: 8px; background: var(--muted); font-size: 0.75rem; word-break: break-all; }

.ed-details { position: relative; display: inline-block; }
.ed-details > summary { list-style: none; cursor: pointer; }
.ed-details > summary::-webkit-details-marker { display: none; }
.ed-popover { position: absolute; z-index: 30; inset-inline-end: 0; top: calc(100% + 6px); width: min(520px, 90vw);
  padding: 16px; border-radius: 12px; border: 1px solid var(--border); background: var(--background);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12); }

.ed-price-row { display: grid; gap: 10px; align-items: end; padding-bottom: 14px; border-bottom: 1px dashed var(--border);
  grid-template-columns: 1fr 1fr; }
.ed-price-row:last-of-type { border-bottom: 0; }
.ed-price-shop { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; }
.ed-price-errors { grid-column: 1 / -1; }
.ed-mini { display: flex; flex-direction: column; gap: 4px; font-size: 0.75rem; color: var(--muted-foreground); min-width: 0; }
@media (min-width: 768px) {
  .ed-price-row { grid-template-columns: repeat(2, minmax(0, 0.8fr)) repeat(2, minmax(0, 1fr)) minmax(0, 1.2fr) auto; }
}
.ed-nowrap { white-space: nowrap; }

.ed-stat { display: flex; flex-direction: column; gap: 2px; padding: 12px; border-radius: 10px; border: 1px solid var(--border); }

/* Utilities not present in Metronic's compiled Tailwind build */
.text-success { color: var(--color-green-600, #16a34a); }
.text-warning { color: var(--color-yellow-600, #ca8a04); }
.self-end { align-self: flex-end; }
.max-w-\[520px\] { max-width: 520px; }
@media (min-width: 640px) { .sm\:col-span-2 { grid-column: span 2 / span 2; } }
@media (min-width: 768px) { .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Two-factor */
.ed-qr { padding: 10px; background: #fff; border-radius: 12px; border: 1px solid var(--border); line-height: 0; }
.ed-qr svg { width: 192px; height: 192px; }
.ed-code-input { font-size: 1.25rem; letter-spacing: 0.3em; text-align: center; }
.ed-recovery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-width: 420px; }
.ed-recovery code { padding: 6px 10px; border-radius: 8px; background: var(--muted); font-size: 0.85rem; text-align: center; }
.mt-2 { margin-top: 0.5rem; }
@media (min-width: 1024px) { .lg\:col-span-2 { grid-column: span 2 / span 2; } }

/* Sheet sync */
.ed-steps { list-style: decimal; padding-inline-start: 1.25rem; display: flex; flex-direction: column; gap: 4px; }
.ed-steps code { padding: 1px 6px; border-radius: 6px; background: var(--muted); font-size: 0.8rem; }
.ed-script { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.75rem; height: auto; min-height: 260px; white-space: pre; }
@media (min-width: 1024px) { .lg\:col-span-3 { grid-column: span 3 / span 3; } }