/* Centralised Accessibility Statement - frontend styles */

.cas-widget {
    --cas-bg: #1a56db;
    --cas-fg: #ffffff;
    --cas-hover-bg: #1749b8;
    --cas-hover-fg: #ffffff;
    --cas-accent: #03416C;
    --cas-modal-bg: #ffffff;
    --cas-modal-text: #3E3E3E;
    --cas-modal-heading: #526080;
    --cas-offset-x: 20px;
    --cas-offset-y: 20px;
    --cas-modal-width: 780px;
    --cas-modal-radius: 10px;
    --cas-font-size: 14px;
    --cas-font-weight: 600;
    --cas-icon-size: 18px;
    --cas-gap: 8px;
    --cas-padding-x: 16px;
    --cas-padding-y: 10px;
    --cas-border-width: 2px;
    --cas-border-style: solid;
    --cas-border-color: transparent;
    --cas-button-radius: 999px;
    --cas-shadow-x: 0px;
    --cas-shadow-y: 4px;
    --cas-shadow-blur: 12px;
    --cas-shadow-spread: 0px;
    --cas-shadow-color: rgba(0,0,0,.2);
    --cas-hover-lift: 1px;
    --cas-focus-color: #ffbf47;
    --cas-transition: 150ms;
}

/* Floating button */
.cas-fab {
    position: fixed;
    bottom: var(--cas-offset-y);
    z-index: 99998;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--cas-gap);
    background: var(--cas-bg);
    color: var(--cas-fg);
    border: var(--cas-border-width) var(--cas-border-style) var(--cas-border-color);
    font: var(--cas-font-weight) var(--cas-font-size)/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    cursor: pointer;
    box-shadow: var(--cas-shadow-x) var(--cas-shadow-y) var(--cas-shadow-blur) var(--cas-shadow-spread) var(--cas-shadow-color);
    transition: transform var(--cas-transition) ease, box-shadow var(--cas-transition) ease, background-color var(--cas-transition) ease, color var(--cas-transition) ease;
    padding: var(--cas-padding-y) var(--cas-padding-x);
    border-radius: var(--cas-button-radius);
}
.cas-fab.cas-pos-right { right: var(--cas-offset-x); }
.cas-fab.cas-pos-left  { left:  var(--cas-offset-x); }
.cas-fab:hover  { background: var(--cas-hover-bg); color: var(--cas-hover-fg); transform: translateY(calc(-1 * var(--cas-hover-lift))); }
.cas-fab:focus-visible  { outline: 3px solid var(--cas-focus-color); outline-offset: 2px; }
.cas-fab-icon   { display: inline-flex; }
.cas-fab-icon svg { width: var(--cas-icon-size); height: var(--cas-icon-size); display: block; }

/* Shapes */
.cas-fab.cas-shape-pill,
.cas-fab.cas-shape-rounded { border-radius: var(--cas-button-radius); }
.cas-fab.cas-shape-circle  {
    border-radius: 50%;
    padding: 0;
    width: 52px;
    height: 52px;
    aspect-ratio: 1 / 1;
}
.cas-fab.cas-shape-circle .cas-fab-label { display: none; }
.cas-fab.cas-shape-circle .cas-fab-icon svg { width: var(--cas-icon-size); height: var(--cas-icon-size); }

/* Sizes */
.cas-fab.cas-size-small.cas-shape-circle  { width: 40px; height: 40px; padding: 0; }
.cas-fab.cas-size-medium.cas-shape-circle { width: 52px; height: 52px; padding: 0; }
.cas-fab.cas-size-large.cas-shape-circle  { width: 64px; height: 64px; padding: 0; }

/* Modal */
.cas-modal[hidden] { display: none; }
.cas-modal {
    position: fixed; inset: 0;
    z-index: 99999;
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
}
.cas-modal-backdrop {
    position: absolute; inset: 0;
    background: rgba(0,0,0,0.55);
}
.cas-modal-dialog {
    position: relative;
    background: var(--cas-modal-bg);
    color: var(--cas-modal-text);
    max-width: var(--cas-modal-width);
    width: 100%;
    max-height: 90vh;
    display: flex; flex-direction: column;
    border-radius: var(--cas-modal-radius);
    box-shadow: 0 20px 60px rgba(0,0,0,0.35);
    overflow: hidden;
}
.cas-modal-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}
.cas-modal-header h2 { margin: 0; font-size: 18px; color: var(--cas-modal-heading); }
.cas-modal-close {
    background: transparent; border: 0;
    font-size: 28px; line-height: 1;
    cursor: pointer; color: #374151;
    padding: 4px 10px; border-radius: 4px;
}
.cas-modal-close:hover { background: #e5e7eb; }
.cas-modal-close:focus { outline: 3px solid #ffbf47; outline-offset: 2px; }

.cas-modal-body {
    padding: 20px 24px;
    overflow-y: auto;
    line-height: 1.55;
}
.cas-modal-body h2 { font-size: 20px; margin-top: 0; color: var(--cas-modal-heading); }
.cas-modal-body h3 { font-size: 16px; margin-top: 1.4em; color: var(--cas-modal-heading); }
.cas-modal-body ul { padding-left: 1.3em; }
.cas-modal-body a  { color: var(--cas-accent); text-decoration: underline; }

/* Inline shortcode statement */
.cas-inline-statement .cas-statement {
    color: var(--cas-modal-text);
}
.cas-statement > h3 { margin-top: 1.75em; }
.cas-inline-statement .cas-statement h2,
.cas-inline-statement .cas-statement h3 { color: var(--cas-modal-heading); }
.cas-inline-statement .cas-statement a { color: var(--cas-accent); text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
    .cas-fab { transition: none; }
    .cas-fab:hover { transform: none; }
}
.cas-shortcode-warning {
    margin: 1rem 0;
    padding: .75rem 1rem;
    border-left: 4px solid #dba617;
    background: #fcf9e8;
    color: #3c434a;
}
