/*
 * SETUP MODULE CARDS
 * Polite Platform :: Control Plane
 * Path: /control-plane/public/assets/setup-module-cards.css
 * Description: Compact module-card layout for setup and Templates surfaces.
 * Context: UI
 * Author: Polite Platform Team
 * Date: 2026-09-11T17:50:09Z
 * Generated by: GPT-5.6 Luna
 */
.setup-module-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.setup-module-card {
  position: relative;
  display: flex;
  align-items: stretch;
  min-width: 0;
  min-height: 96px;
  padding: 0;
  overflow: visible;
}
.setup-module-main {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  min-height: 96px;
  padding: 13px 10px 10px;
  color: inherit;
  text-align: center;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.setup-module-main:disabled { cursor: not-allowed; }
.setup-module-icon { flex: 0 0 auto; font-size: 23px; color: var(--accent, #d4a574); }
.setup-module-copy { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; max-width: 100%; }
.setup-module-copy .tname { overflow-wrap: anywhere; }
.setup-module-copy .tvalue, .setup-module-scope { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.setup-module-scope { color: var(--text-dim, #8a8f98); font-size: 11px; }
.setup-module-template { color: var(--text-dim, #8a8f98); font-size: 12px; overflow-wrap: anywhere; }
.setup-module-readiness { font-size: 11px; color: var(--text-dim, #8a8f98); }
.setup-module-readiness.status-ready { color: var(--green, #69d18f); font-weight: 600; }
.setup-module-readiness.status-incomplete { color: var(--warning, #ffd60a); }
.setup-module-card--unavailable .setup-module-icon, .setup-module-card--unavailable .setup-module-readiness { color: var(--text-dim, #8a8f98); }
.setup-module-status.setup-module-status--unavailable { color: var(--text-dim, #8a8f98); font-size: 11px; font-weight: 600; }
.setup-module-options { position: absolute; top: 8px; right: 8px; z-index: 2; margin: 0; padding: 0; border: 0; background: transparent; }
.setup-module-options summary {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  font-size: 22px;
  color: var(--text-dim, #8a8f98);
  border-radius: 8px;
  cursor: pointer;
  list-style: none;
}
.setup-module-options summary::-webkit-details-marker { display: none; }
.setup-module-card:has(.setup-module-options[open]) { z-index: 3; }
.setup-module-options summary:hover, .setup-module-options summary:focus-visible { color: var(--text, #f4f2ec); background: var(--surface-raised, #242428); }
.setup-module-option-list { position: absolute; top: 44px; right: 0; z-index: 5; display: flex; flex-direction: column; gap: 3px; min-width: 142px; padding: 6px; background: var(--surface-raised, #242428); border: 1px solid var(--border, #3a3a3f); border-radius: 9px; box-shadow: 0 12px 28px rgba(0,0,0,.35); }
.setup-module-option-list button { min-height: 44px; padding: 7px 10px; color: inherit; text-align: left; background: transparent; border: 0; border-radius: 6px; cursor: pointer; }
.setup-module-option-list button:hover, .setup-module-option-list button:focus-visible { background: var(--surface-hover, #303036); }
.setup-module-status { padding: 5px 8px; font-size: 11px; color: var(--warning, #ffd60a); }
.setup-module-status.status-approved { color: var(--green, #69d18f); }
.setup-module-card--read-only .setup-module-options { display: none; }
.setup-module-card--inline { min-height: 52px; border: 0; background: transparent; }
.setup-module-card--inline .setup-module-main { flex-direction: row; justify-content: flex-start; min-height: 52px; padding: 4px 44px 4px 8px; text-align: left; }
.setup-module-card--inline .setup-module-copy { align-items: flex-start; }
.setup-module-card--inline .setup-module-icon { font-size: 18px; }
@media (max-width: 560px) { .setup-module-card { min-height: 88px; } .setup-module-main { min-height: 88px; } }
@media (max-width: 560px) { .setup-module-grid { grid-template-columns: 1fr; } }
