SSL/TLS Certificate Decoder

/* Page-specific styling for certificate display */ .cert-display { margin-top: 16px; } .cert-subject { font-size: 1.1rem; font-weight: 700; color: #1a3a5c; word-break: break-all; margin-bottom: 8px; } .badge-ca { background: #4CAF50; color: white; padding: 3px 10px; border-radius: 12px; font-size: 0.78rem; font-weight: 600; white-space: nowrap; display: inline-block; margin-right: 6px; } .badge-end-entity { background: #2196F3; color: white; padding: 3px 10px; border-radius: 12px; font-size: 0.78rem; font-weight: 600; white-space: nowrap; display: inline-block; margin-right: 6px; } .chain-index { color: #666; font-size: 0.85rem; font-weight: 400; display: inline-block; } .validity-section { margin-bottom: 16px; padding: 12px 0; border-bottom: 1px solid #f0f0f0; } .validity-label { font-size: 0.85rem; font-weight: 600; color: #555; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.04em; } .validity-dates { display: flex; justify-content: space-between; font-size: 0.82rem; color: #666; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; } .validity-status { font-size: 0.9rem; font-weight: 600; margin-top: 4px; } .validity-status.ok { color: #4CAF50; } .validity-status.warn { color: #fb8c00; } .validity-status.expired { color: #e53935; } .fields-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; margin-bottom: 16px; } @media (max-width: 600px) { .fields-grid { grid-template-columns: 1fr; } } .field-row { display: flex; flex-direction: column; gap: 2px; } .field-label { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.05em; color: #888; font-weight: 600; } .field-value { font-size: 0.92rem; color: #222; word-break: break-all; } .field-value.mono { font-family: 'Courier New', monospace; font-size: 0.82rem; color: #333; } .field-value.weak { color: #e53935; font-weight: 600; } .sans-section { margin-bottom: 16px; } .sans-title { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.05em; color: #888; font-weight: 600; margin-bottom: 8px; } .ocsp-section { border-top: 1px solid #f0f0f0; padding-top: 14px; margin-top: 4px; } .ocsp-title { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.05em; color: #888; font-weight: 600; margin-bottom: 8px; } .ocsp-row { display: flex; gap: 8px; align-items: baseline; margin-bottom: 4px; flex-wrap: wrap; } .ocsp-type { font-size: 0.8rem; font-weight: 600; color: #555; min-width: 90px; flex-shrink: 0; } .ocsp-url { font-family: 'Courier New', monospace; font-size: 0.82rem; color: #1976D2; word-break: break-all; } .ocsp-note { background: #fff8e1; border: 1px solid #ffe082; border-radius: 6px; padding: 10px 14px; font-size: 0.82rem; color: #5d4037; margin-top: 10px; font-family: 'Courier New', monospace; } .no-sans { font-size: 0.88rem; color: #999; font-style: italic; } .error-box { background: #ffebee; border: 1px solid #ef5350; border-radius: 8px; padding: 16px 20px; color: #c62828; margin-bottom: 20px; font-weight: 500; } .results-header { font-size: 1.1rem; font-weight: 600; color: #1a3a5c; margin-bottom: 16px; }