/* Tenseal WP admin panel — minimal, native-feeling, no external deps. */

.tenseal-wrap { max-width: 1100px; }

.tenseal-h1 {
    display: flex; align-items: center; gap: 0.6rem;
    font-size: 1.5rem; font-weight: 600; margin: 1rem 0 1.25rem;
}
.tenseal-h2 { margin: 1.5rem 0 0.75rem; font-size: 1.1rem; font-weight: 600; }
.tenseal-logo {
    display: inline-block; width: 28px; height: 28px;
    background: #00d4aa; border-radius: 6px;
    position: relative; flex-shrink: 0;
}
.tenseal-logo::after {
    content: "T"; position: absolute; inset: 0;
    color: #fff; font-weight: 800; font-size: 18px;
    display: flex; align-items: center; justify-content: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.tenseal-version {
    font-size: 0.7rem; font-weight: 400; color: #6c7781;
    padding: 0.15rem 0.5rem; background: #f0f0f1;
    border-radius: 4px; margin-left: 0.4rem;
}

/* CARD */
.tenseal-card {
    background: #fff; border: 1px solid #c3c4c7; border-radius: 6px;
    padding: 1.25rem 1.5rem; margin-bottom: 1.25rem;
    box-shadow: 0 1px 1px rgba(0,0,0,0.04);
}
.tenseal-card h3 { margin-top: 0; font-size: 1rem; font-weight: 600; }
.tenseal-card pre {
    background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 4px;
    padding: 0.75rem 1rem; overflow-x: auto;
}
.tenseal-card pre code { background: transparent; padding: 0; }

.tenseal-card-empty {
    text-align: center; padding: 2.5rem 1.5rem; color: #50575e;
}
.tenseal-card-empty .dashicons {
    font-size: 2.5rem; width: 2.5rem; height: 2.5rem; color: #2271b1;
    margin-bottom: 0.75rem;
}
.tenseal-card-empty h3 { margin: 0.5rem 0; font-size: 1.05rem; }
.tenseal-card-empty .button { margin-top: 0.75rem; }

.tenseal-card-error {
    border-color: #d63638; background: #fcf0f1;
}
.tenseal-card-error strong { color: #d63638; display: block; margin-bottom: 0.25rem; }

/* STATUS */
.tenseal-status {
    display: flex; align-items: center; gap: 1rem;
}
.tenseal-status strong { display: block; font-size: 1rem; }
.tenseal-status p { margin: 0.15rem 0 0.5rem; }
.tenseal-dot {
    width: 14px; height: 14px; border-radius: 50%; flex-shrink: 0;
    box-shadow: 0 0 0 4px rgba(0,0,0,0.04);
}
.tenseal-dot-ok   { background: #00a32a; box-shadow: 0 0 0 4px rgba(0,163,42,0.15); }
.tenseal-dot-warn { background: #dba617; box-shadow: 0 0 0 4px rgba(219,166,23,0.15); }
.tenseal-dot-off  { background: #8c8f94; box-shadow: 0 0 0 4px rgba(140,143,148,0.15); }

.tenseal-muted { color: #6c7781; font-size: 0.88rem; margin: 0.25rem 0; }
.tenseal-ok  { color: #00a32a !important; }
.tenseal-err { color: #d63638 !important; }

/* QUICK ACTION TILES */
.tenseal-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem; margin-bottom: 1.5rem;
}
.tenseal-tile {
    background: #fff; border: 1px solid #c3c4c7; border-radius: 6px;
    padding: 1.25rem; text-decoration: none; color: #1d2327;
    display: flex; flex-direction: column; gap: 0.4rem;
    transition: border-color 0.15s, transform 0.15s;
}
.tenseal-tile:hover { border-color: #00d4aa; transform: translateY(-2px); color: #1d2327; }
.tenseal-tile .dashicons {
    font-size: 1.5rem; width: 1.5rem; height: 1.5rem; color: #00d4aa;
}
.tenseal-tile strong { font-size: 0.95rem; }
.tenseal-tile small { color: #6c7781; font-size: 0.82rem; }

/* STEPS */
.tenseal-steps {
    margin: 0.5rem 0 1rem 1.25rem; line-height: 1.7;
}
.tenseal-steps li { margin-bottom: 0.35rem; }

.tenseal-bullets {
    margin: 0.25rem 0 0.75rem 1.25rem; line-height: 1.7;
}

/* FORMS LIST */
.tenseal-forms-list {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 1rem; margin-top: 1rem;
}
.tenseal-form-card {
    background: #fff; border: 1px solid #c3c4c7; border-radius: 6px;
    padding: 1.25rem;
}
.tenseal-form-card-head {
    display: flex; align-items: center; justify-content: space-between;
    gap: 0.5rem; margin-bottom: 0.5rem;
}
.tenseal-form-card h3 {
    margin: 0; font-size: 1.02rem; font-weight: 600;
}
.tenseal-badge {
    background: rgba(0,212,170,0.12); color: #00857a;
    font-size: 0.72rem; font-weight: 600;
    padding: 0.18rem 0.55rem; border-radius: 999px;
    white-space: nowrap;
}
.tenseal-shortcode-row {
    display: flex; gap: 0.5rem; align-items: stretch;
    margin: 0.9rem 0;
}
.tenseal-shortcode-row code {
    flex: 1; background: #f6f7f7; border: 1px solid #dcdcde;
    padding: 0.55rem 0.75rem; border-radius: 4px;
    font-size: 0.85rem; overflow-x: auto; white-space: nowrap;
    display: flex; align-items: center;
}
.tenseal-copy-btn { white-space: nowrap; }
.tenseal-copy-btn.tenseal-copied {
    background: #00a32a !important; border-color: #00a32a !important;
}
.tenseal-form-card-foot {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 0.82rem; margin-top: 0.5rem;
    padding-top: 0.75rem; border-top: 1px solid #f0f0f1;
}
.tenseal-form-card-foot code { background: #f6f7f7; padding: 0.1rem 0.35rem; border-radius: 3px; }
.tenseal-link { text-decoration: none; color: #2271b1; }
.tenseal-link:hover { color: #135e96; }

/* TROUBLESHOOTING DETAILS */
.tenseal-card details {
    border-top: 1px solid #f0f0f1; padding: 0.75rem 0;
}
.tenseal-card details:first-of-type { border-top: none; padding-top: 0.25rem; }
.tenseal-card details summary { cursor: pointer; padding: 0.25rem 0; }
.tenseal-card details summary strong { font-weight: 600; }
.tenseal-card details p { margin: 0.5rem 0 0.25rem 1rem; color: #50575e; }