button_link {
    overflow: visible;
}

/*html {*/
/*	font-family: sans-serif;*/
/*	line-height: 1.15;*/
/*	-ms-text-size-adjust: 100%;*/
/*	-webkit-text-size-adjust: 100%;*/
/*}*/

/*body {*/
/*	margin: 0;*/
/*}*/

.button_link {
    font: inherit;
    margin: 0;
    text-decoration: none;
}

.button_link {
    text-transform: none;
}

/*.button_link {*/
/*	-webkit-appearance: button;*/
/*}*/

/*button::-moz-focus-inner {*/
/*	border-style: none;*/
/*	padding: 0;*/
/*}*/

/*button:-moz-focusring {*/
/*	outline: ButtonText dotted 1px;*/
/*}*/

/*::-webkit-input-placeholder {*/
/*	color: inherit;*/
/*	opacity: 0.54;*/
/*}*/

/*::-webkit-file-upload-button {*/
/*	-webkit-appearance: button;*/
/*	font: inherit;*/
/*}*/

/*html {*/
/*	height: 100%;*/
/*}*/

/*body {*/
/*	background: #fafafa;*/
/*	background: radial-gradient(ellipse at center, #fafafa 0%, #dddddd 100%);*/
/*	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#dddddd',GradientType=1 );*/
/*	font-family: "proxima-nova";*/
/*}*/

@-webkit-keyframes hoverAnimation {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes hoverAnimation {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.cover_class {
    display: inline-block;
    max-width: 100%;
    background-repeat: no-repeat;
    min-width: 157px;
    min-height: 252px;
}

@media (min-width: 576px) {
    .cover_class {
        display: inline-block;
        max-width: 100%;
        background-repeat: no-repeat;
        min-width: 157px;
        min-height: 252px;
    }
}

@media (min-width: 768px) {
    .cover_class {
        display: inline-block;
        max-width: 100%;
        background-repeat: no-repeat;
        min-width: 157px;
        min-height: 252px;
    }
}

@media (min-width: 992px) {
    .cover_class {
        display: inline-block;
        max-width: 100%;
        background-repeat: no-repeat;
        min-width: 262px;
        min-height: 420px;
    }
}

/* --- START: Removed AI Icon Toggle Switch Styles --- */
/* --- END: Removed AI Icon Toggle Switch Styles --- */


/* --- START: AI Icon Styles --- */

/* The container for the whole book cover item.
   This is the element we will hover over.
   'position: relative' is crucial for positioning the icon inside it. */
.cover-item {
    position: relative;
}

/* The wrapper for the AI icon.
   It's positioned in the top-left corner of its parent (.cover-item). */
.ai-icon-wrapper {
    position: absolute;
    top: 0px;
    left: 15px;
    z-index: 10;
    opacity: 0; /* MODIFIED: Initially hidden */
    transition: opacity 0.3s ease-in-out; /* Smooth fade effect on hover */
    pointer-events: none; /* Allows clicks to go through to the link below */
}

/* NEW: When the toggle is ON, make the icon slightly visible */
.show-ai-icons .ai-icon-wrapper {
    opacity: 0.2;
}

/* The circular background for the icon */
.ai-icon-background {
    display: flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background-color: rgba(22, 22, 22, 0.85);
}

/* The SVG icon itself */
.ai-icon-svg {
    fill: white;
}

/* The hover effect: when hovering over the .cover-item, make the icon visible */
/* MODIFIED: This now only works when the .show-ai-icons class is present */
.show-ai-icons .cover-item:hover .ai-icon-wrapper {
    opacity: 0.5; /* Hover state: more visible */
}

/* --- END: AI Icon Styles --- */