/* Cookie consent banner + preferences modal (2026-07-26) */

#ccBanner {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 100000;
    background: #fff; border-top: 3px solid #a73520;
    box-shadow: 0 -2px 12px rgba(0,0,0,.18);
    padding: 16px 18px; font-size: 14px; line-height: 1.5; color: #333;
}
#ccBanner .cc-inner { max-width: 1170px; margin: 0 auto; }
#ccBanner p { margin: 0 0 12px; }
#ccBanner a { color: #a73520; text-decoration: underline; }

/* Equal prominence: accept and reject share the same style (EDPB guidance) */
.cc-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.cc-btn {
    display: inline-block; padding: 10px 18px; border: 1px solid #a73520;
    border-radius: 3px; font-size: 14px; font-weight: 600; cursor: pointer;
    background: #fff; color: #a73520; line-height: 1.2;
}
.cc-btn:hover { background: #f6ece9; }
.cc-btn-primary { background: #a73520; color: #fff; }
.cc-btn-primary:hover { background: #8e2c1a; color: #fff; }
.cc-btn-link {
    background: none; border: none; color: #666; text-decoration: underline;
    padding: 10px 6px; cursor: pointer; font-size: 14px;
}

/* Modal */
#ccModal {
    position: fixed; inset: 0; z-index: 100001;
    background: rgba(0,0,0,.5); display: flex;
    align-items: center; justify-content: center; padding: 16px;
}
#ccModal .cc-box {
    background: #fff; max-width: 620px; width: 100%;
    max-height: 88vh; overflow: auto; border-radius: 4px; padding: 22px;
}
#ccModal h3 { margin: 0 0 14px; font-size: 19px; }
.cc-cat {
    border: 1px solid #e3e3e3; border-radius: 3px;
    padding: 12px 14px; margin-bottom: 10px;
}
.cc-cat-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.cc-cat-head strong { font-size: 15px; }
.cc-cat p { margin: 6px 0 0; font-size: 13px; color: #666; line-height: 1.45; }
.cc-cat input[type=checkbox] { width: 18px; height: 18px; margin: 0; }
.cc-cat .cc-locked { font-size: 12px; color: #888; white-space: nowrap; }
.cc-modal-actions { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 600px) {
    .cc-actions .cc-btn, .cc-modal-actions .cc-btn { flex: 1 1 100%; text-align: center; }
}
