/* Custom styles for cookie consent modal */

/* Cookie consent variables */
:root {
    --cc-bg: #ffffff;
    --cc-secondary-color: #000000;
    --cc-toggle-off-bg: #db3138;
    --cc-toggle-on-bg: #316e3d;
    
    /* Button colors - these will be set dynamically */
    --cc-btn-secondary-bg: #F2F2F2;
    --cc-btn-secondary-color: #000000;
    --cc-btn-secondary-border-color: #F2F2F2;
    --cc-btn-secondary-hover-bg: #DDDDDD;
    --cc-btn-secondary-hover-color: #000000;
    --cc-btn-secondary-hover-border-color: #DDDDDD;
}

/* Modal width */
#cc-main .cm--box.cm--wide {
    max-width: 55em;
}

/* Modal text colors and padding */
#cc-main .cm__body {
    padding: 20px 25px;
}

#cc-main .cm__desc, 
#cc-main .cm__title, 
#cc-main .cm__btns, 
#cc-main .cm__links {
    padding: 0;
}

#cc-main .cm__desc {
    margin-top: 20px;
}

#cc-main .cm__btns {
    margin-top: 20px;
    padding-top: 20px;
}

#cc-main .cm__footer {
    padding: 10px 25px;
}

/* Text colors */
#cc-main .cm__desc,
#cc-main .cm__title,
#cc-main .pm__title,
#cc-main .pm__section-title {
    color: #000000;
}

/* Button spacing */
#cc-main .cm__btn-group {
    gap: 1rem;
}

/* Toggle section styling */
#cc-main .pm__section--toggle .pm__section-title {
    background: var(--cc-btn-secondary-bg);
    border-color: var(--cc-btn-secondary-border-color);
}

#cc-main .pm__section--toggle .pm__section-title:hover {
    background: var(--cc-btn-secondary-hover-bg);
    border-color: var(--cc-btn-secondary-hover-border-color);
}

#cc-main .pm__section--expandable .pm__section-arrow {
    background: var(--cc-btn-secondary-hover-bg);
}

/* Button styles */
#cc-main .c-bn {
    padding: 1em 1.4em;
    font-size: 1.05em;
    min-height: 3em;
    min-width: 140px;
    flex: 1;
}

/* Primary button hover states */
#cc-main .c-bn.c-bn-primary:hover,
#cc-main .c-bn.c-bn-primary:focus {
    background-color: var(--cc-btn-primary-hover-bg) !important;
    border-color: var(--cc-btn-primary-hover-border-color) !important;
    color: var(--cc-btn-primary-hover-color) !important;
}

/* Preferences modal */
#cc-main .p-cnt {
    max-width: 45em;
    padding: 2em;
}

#cc-main #s-cnt .b-bn {
    padding: 1em 1.4em;
    font-size: 1.05em;
    min-height: 3em;
}

#cc-main .p-c .b-bn .b-tl {
    padding: 1em 1.4em;
    font-size: 1.05em;
}

#cc-main #s-c-bn {
    padding: 1em 1.4em;
    font-size: 1.05em;
}

/* Modal positioning */
#cc-main #cm {
    transform: translateY(-50%);
    top: 50%;
}

/* Floating button */
button.cc-floating-button,
button.cc-floating-button:active,
button.cc-floating-button:focus{
    position: fixed;
    top: auto;
    bottom: 20px;
    left: 20px;
    height: 48px;
    min-width: 48px;
    border-radius: 24px;
    background: var(--cc-btn-primary-bg);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0 14px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    transition: width 0.3s ease, visibility 0.3s ease, transform 0.2s ease;
    z-index: 1000;
    width: 48px;
    overflow: hidden;
    transform: scale(1);
}

.cc-floating-button:hover {
    width: 180px;
    transform: scale(1.05);
}

.cc-floating-button svg {
    color: var(--cc-btn-primary-color);
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.cc-floating-button::after {
    content: attr(data-text);
    color: var(--cc-btn-primary-color);
    font-size: 14px;
    white-space: nowrap;
    margin-left: 14px;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.cc-floating-button:hover::after {
    opacity: 1;
}

.wp-block-embed [data-service]{
    position: absolute;
    inset: 0;
}