/* Scrisorile gata de completat din seria „Ce faci când…” (views/partials/blog-scrisoare.ejs, public/js/blog-scrisoare.js) */
.sc-tool { margin: 2em 0; padding: 18px; border-radius: 18px; border: 1px solid #bbf7d0; background: linear-gradient(180deg, #f0fdf4, #fff 160px); color: #0f172a; font-size: .95rem; }
.sc-k { display: inline-block; font-size: .72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #166534; background: #dcfce7; border-radius: 99px; padding: 3px 9px; }
.sc-head h3 { font-size: 1.15rem; font-weight: 800; margin: 8px 0 4px; line-height: 1.3; }
.sc-head p { color: #475569; margin: 0 0 14px; line-height: 1.5; }
.sc-grid { display: grid; gap: 16px; }
@media (min-width: 900px) { .sc-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: start; } }
.sc-form { display: grid; gap: 14px; min-width: 0; }
.sc-form fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 10px; min-width: 0; }
.sc-form legend { font-weight: 800; font-size: .9rem; margin-bottom: 6px; color: #1e293b; }
.sc-field { display: grid; gap: 4px; font-size: .85rem; color: #334155; min-width: 0; }
.sc-field input, .sc-field textarea { width: 100%; min-width: 0; border: 1px solid #cbd5e1; border-radius: 10px; padding: 9px 10px; font: inherit; font-size: 1rem; color: #0f172a; background: #fff; box-sizing: border-box; }
.sc-field textarea { resize: vertical; line-height: 1.4; }
.sc-field input:focus, .sc-field textarea:focus { outline: none; border-color: #16a34a; box-shadow: 0 0 0 3px #dcfce7; }
.sc-field ::placeholder { color: #94a3b8; }
.sc-preview { min-width: 0; }
@media (min-width: 900px) { .sc-preview { position: sticky; top: 84px; } }
.sc-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.sc-btn { min-height: 44px; padding: 8px 14px; border-radius: 10px; border: 1px solid #cbd5e1; background: #fff; color: #0f172a; font: inherit; font-weight: 700; font-size: .9rem; cursor: pointer; }
.sc-btn:hover { border-color: #16a34a; }
.sc-btn--main { background: #15803d; border-color: #15803d; color: #fff; }
.sc-btn--main:hover { background: #166534; }
.sc-btn--ghost { border-color: transparent; color: #475569; background: transparent; }
.sc-btn:focus-visible { outline: 3px solid #86efac; outline-offset: 2px; }
.sc-status { min-height: 1.2em; margin: 0 0 6px; font-size: .85rem; color: #166534; font-weight: 600; }
.sc-sheet { background: #fff; border: 1px solid #e2e8f0; border-radius: 6px; box-shadow: 0 2px 10px rgba(15, 23, 42, .06); padding: 22px 20px; font-family: Georgia, 'Times New Roman', serif; font-size: .93rem; line-height: 1.55; color: #111827; overflow-wrap: anywhere; }
.sc-sheet p { margin: 0 0 .8em; }
.sc-from { margin-bottom: 1.1em; }
.sc-date { text-align: right; }
.sc-kind { text-align: center; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin: 1.1em 0 .4em !important; }
.sc-subj { margin-bottom: 1.1em !important; }
.sc-anexe { font-size: .88em; color: #334155; }
.sc-sign { margin-top: 1.4em !important; }
.sc-line { display: inline-block; margin-top: 1.6em; }
.sc-ex { color: #64748b; font-style: italic; background: #f1f5f9; border-radius: 3px; padding: 0 2px; }
.sc-hint { font-size: .78rem; color: #64748b; margin: 8px 0 0; line-height: 1.45; }
.sc-how { margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #fffbeb; border: 1px solid #fde68a; color: #422006; line-height: 1.5; font-size: .9rem; }
@media (max-width: 480px) { .sc-tool { padding: 14px; } .sc-sheet { padding: 16px 14px; font-size: .9rem; } .sc-btn { flex: 1 1 auto; } }