/*
 * Probel GDPR storefront pages. Only own gdpr-* classes; colours follow the
 * theme through currentColor and inherit, so the pages fit any theme.
 * The Bootstrap classes in the templates (btn, alert, table) are optional
 * extras a Bootstrap theme styles; without them these rules suffice.
 */
.gdpr-page .gdpr-intro { margin-bottom: 1em; }
.gdpr-page .gdpr-blocks { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin: 1.5em 0; }
.gdpr-page .gdpr-block { border: 1px solid rgba(127, 127, 127, 0.35); border-radius: 6px; padding: 16px 18px; margin-bottom: 16px; min-width: 0; }
.gdpr-page .gdpr-blocks .gdpr-block { margin-bottom: 0; }
.gdpr-page .gdpr-block-title { font-size: 1.25em; margin: 0 0 0.6em; }
.gdpr-page .gdpr-block-erase { border-color: rgba(200, 40, 40, 0.45); }
.gdpr-page .gdpr-warning { border-left: 4px solid rgba(200, 120, 0, 0.8); padding: 6px 10px; background: rgba(200, 120, 0, 0.08); }
.gdpr-page .gdpr-hint { font-size: 0.92em; opacity: 0.85; }
.gdpr-page .gdpr-form { margin: 0.8em 0 0; }
.gdpr-page .gdpr-field { margin-bottom: 1em; border: 0; padding: 0; min-width: 0; }
.gdpr-page .gdpr-label { display: block; font-weight: bold; margin-bottom: 0.4em; padding: 0; border: 0; font-size: inherit; }
.gdpr-page .gdpr-input { display: block; width: 100%; max-width: 420px; box-sizing: border-box; padding: 8px 10px; font: inherit; }
.gdpr-page .gdpr-choice, .gdpr-page .gdpr-check { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 0.6em; font-weight: normal; cursor: pointer; }
.gdpr-page .gdpr-choice input, .gdpr-page .gdpr-check input { margin-top: 0.25em; flex: 0 0 auto; }
.gdpr-page .gdpr-field-error { margin-top: 0.3em; }
.gdpr-page .gdpr-button { display: inline-block; cursor: pointer; margin-top: 0.4em; }
.gdpr-page .gdpr-alert { padding: 10px 14px; border-radius: 4px; margin: 0 0 1em; border: 1px solid rgba(127, 127, 127, 0.35); }
.gdpr-page .gdpr-alert-success { border-color: rgba(40, 140, 60, 0.6); }
.gdpr-page .gdpr-alert-error { border-color: rgba(200, 40, 40, 0.6); }
.gdpr-page .gdpr-table-wrap { overflow-x: auto; }
.gdpr-page .gdpr-table { width: 100%; border-collapse: collapse; }
.gdpr-page .gdpr-table th, .gdpr-page .gdpr-table td { text-align: left; padding: 8px; border-bottom: 1px solid rgba(127, 127, 127, 0.25); vertical-align: top; }
.gdpr-page .gdpr-inline-form { display: inline-block; margin: 0 8px 4px 0; }
.gdpr-page .gdpr-link-button { background: none; border: 0; padding: 0; color: inherit; text-decoration: underline; cursor: pointer; font: inherit; }
.gdpr-page .gdpr-status { font-weight: bold; }
.gdpr-page [hidden] { display: none !important; }
.gdpr-page .gdpr-details { margin: 0.6em 0 1em; }
.gdpr-page .gdpr-details summary { cursor: pointer; font-weight: bold; }
.gdpr-page .gdpr-group-title { font-weight: bold; margin: 0.8em 0 0.3em; }
.gdpr-page .gdpr-list { margin: 0 0 0.6em 1.2em; padding: 0; }
.gdpr-page .gdpr-notices { border-left: 4px solid rgba(30, 110, 200, 0.7); padding: 4px 10px; margin: 0 0 1em; background: rgba(30, 110, 200, 0.06); }

@media (max-width: 600px) {
	.gdpr-page .gdpr-table thead { display: none; }
	.gdpr-page .gdpr-table tr { display: block; border-bottom: 1px solid rgba(127, 127, 127, 0.35); padding: 6px 0; }
	.gdpr-page .gdpr-table td { display: block; border: 0; padding: 4px 0; }
	.gdpr-page .gdpr-table td::before { content: attr(data-label); display: block; font-size: 0.85em; opacity: 0.75; }
	.gdpr-page .gdpr-table td:empty, .gdpr-page .gdpr-table td.gdpr-empty { display: none; }
}
