/* Legal + Guide pages — uses style.css base */

.legal-page { background: linear-gradient(180deg, #faf6ee 0%, #f3eddf 100%); }
.legal-page .container { max-width: 880px; }

.legal-tabs {
    display: flex; gap: 4px; margin: 24px 0 16px;
    background: #fff; padding: 6px; border-radius: 12px;
    border: 1px solid #e0d8c8;
}
.legal-tab {
    flex: 1; padding: 12px;
    background: transparent; border: none; cursor: pointer;
    font-family: inherit; font-weight: 700; color: #8a7d63;
    border-radius: 8px; font-size: 14px;
    transition: all 0.18s;
}
.legal-tab:hover { background: #faf6ee; color: #6b5e44; }
.legal-tab.active { background: linear-gradient(135deg, #d4af37, #a38538); color: #fff; }

.legal-content {
    display: none;
    background: #fff; padding: 28px 32px; border-radius: 12px;
    border: 1px solid #e0d8c8;
    line-height: 1.95; color: #1a3a4a;
}
.legal-content.active { display: block; }
.legal-content h2 {
    color: #5a4528; margin-bottom: 18px;
    border-bottom: 2px solid #d4af37; padding-bottom: 10px;
    font-family: 'Amiri', serif; font-size: 28px;
}
.legal-content h3 {
    color: #5a4528; margin: 22px 0 10px;
    font-size: 18px; font-weight: 700;
}
.legal-content p { margin-bottom: 12px; }
.legal-content ul, .legal-content ol { padding-right: 24px; margin-bottom: 14px; }
.legal-content li { margin-bottom: 6px; }
.legal-content a { color: #8a6914; text-decoration: none; font-weight: 700; }
.legal-content a:hover { text-decoration: underline; }

/* Guide page specifics */
.guide-toc {
    background: #fef6e0; border: 1px solid #d4af37;
    padding: 18px 22px; border-radius: 10px; margin-bottom: 20px;
}
.guide-toc h3 { color: #5a4528; margin-bottom: 10px; }
.guide-toc ul { padding-right: 22px; line-height: 2; }
.guide-toc a {
    color: #5a4528; font-weight: 600; text-decoration: none;
}
.guide-toc a:hover { color: #8a6914; text-decoration: underline; }

.guide-section {
    background: #fff; padding: 24px 28px; border-radius: 12px;
    border: 1px solid #e0d8c8; margin-bottom: 16px;
    line-height: 1.95; color: #1a3a4a;
}
.guide-section h2 {
    color: #5a4528; margin-bottom: 14px;
    font-family: 'Amiri', serif; font-size: 24px;
}
.guide-section ul, .guide-section ol { padding-right: 24px; margin: 8px 0; }
.guide-section li { margin-bottom: 6px; }
.guide-section b { color: #5a4528; }

.guide-tip {
    background: #fef6e0; border-right: 4px solid #d4af37;
    padding: 12px 16px; border-radius: 8px; margin: 14px 0;
    color: #8a6914;
}

.tools-table {
    width: 100%; border-collapse: collapse; margin: 12px 0;
    background: #faf6ee; border-radius: 8px; overflow: hidden;
}
.tools-table td {
    padding: 10px 14px; border-bottom: 1px solid #e8dfcb;
    vertical-align: middle;
}
.tools-table td:first-child {
    color: #5a4528; font-weight: 700; white-space: nowrap;
    width: 160px; border-left: 1px solid #e8dfcb;
}
.tools-table tr:last-child td { border-bottom: none; }

.color-chip {
    display: inline-block; padding: 2px 10px; border-radius: 11px;
    color: #fff; font-size: 11.5px; font-weight: 700; margin: 0 2px;
}
.color-chip.green { background: #2e7d32; }
.color-chip.yellow { background: #ef6c00; }
.color-chip.red { background: #c62828; }
.color-chip.purple { background: #7e57c2; }

.guide-end { text-align: center; margin: 24px 0; }
.guide-cta {
    display: inline-block; background: linear-gradient(135deg, #d4af37, #a38538);
    color: #fff; padding: 14px 32px; border-radius: 10px;
    font-family: inherit; font-weight: 700; font-size: 17px;
    text-decoration: none;
}
.guide-cta:hover { opacity: 0.92; }

@media (max-width: 640px) {
    .legal-tab { font-size: 12px; padding: 10px 6px; }
    .legal-content { padding: 18px 16px; }
    .tools-table td:first-child { width: auto; font-size: 13px; }
}