/* Kaltura Player CSS Fix for Kitaboo Reader
 * Purpose: Override global Kitaboo CSS that interferes with Kaltura player
 * The global [class*=icon] selector forces kitabooread font-family and other styles
 * onto ALL elements with "icon" in the class name, breaking Kaltura's UI
 */

/* 0. CRITICAL: Reset ALL CSS from global selectors including transform-origin */
/* Reset transitions, transforms, animations, and transform-origin from * selector */
/* Also reset ALL properties from global [class^='icon-'], [class$='-icon'], [class*='icon'] selector */
/* BUT preserve Kaltura's own animations like spinner */
#kaltura_video *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"]),
#kaltura_video *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::before,
#kaltura_video *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::after,
.kaltura-player-container *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"]),
.kaltura-player-container *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::before,
.kaltura-player-container *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::after {
/*    transition: none !important;*/
    animation: none !important;
    -webkit-animation: none !important;
}

/* Don't reset transform-origin on spinner/loader - they need it for rotation */
#kaltura_video *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"]),
#kaltura_video *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::before,
#kaltura_video *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::after,
.kaltura-player-container *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"]),
.kaltura-player-container *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::before,
.kaltura-player-container *:not([class*="playkit-spinner"]):not([class*="playkit-loader"]):not([class*="playkit-pre-playback"])::after {
    transform-origin: initial !important;
    -webkit-transform-origin: initial !important;
    -moz-transform-origin: initial !important;
    -ms-transform-origin: initial !important;
    -o-transform-origin: initial !important;
    font-family: Source Sans3;
}

/* CRITICAL FIX: Spinner must rotate from center, not from top-left */
#kaltura_video [class*="playkit-spinner"],
.kaltura-player-container [class*="playkit-spinner"] {
    transform-origin: center center !important;
    -webkit-transform-origin: center center !important;
    -moz-transform-origin: center center !important;
    -ms-transform-origin: center center !important;
    -o-transform-origin: center center !important;
}

/* CRITICAL: Reset all properties from [class^='icon-'], [class$='-icon'], [class*='icon'] */
#kaltura_video [class^='icon-'],
#kaltura_video [class$='-icon'],
#kaltura_video [class*='icon'],
.kaltura-player-container [class^='icon-'],
.kaltura-player-container [class$='-icon'],
.kaltura-player-container [class*='icon'] {

    text-rendering: auto !important;
    -webkit-font-smoothing: auto !important;
    -moz-osx-font-smoothing: auto !important;

    font-family: inherit !important;

    cursor: inherit !important;
    justify-content: initial !important;
    line-height: normal !important;
}

/* Now selectively re-enable Kaltura's own transitions and animations */
#kaltura_video .playkit-*,
.kaltura-player-container .playkit-* {
    transition: inherit !important;
    animation: inherit !important;
    -webkit-animation: inherit !important;
}

/* 1. FIX: Reset font-family from kitabooread to default */
#kaltura_video,
#kaltura_video *,
.kaltura-player-container,
.kaltura-player-container * {
    font-family: initial !important;
}

/* 2. FIX: Reset line-height that breaks button layout */
#kaltura_video *[class*="playkit"],
.kaltura-player-container *[class*="playkit"] {
   /* line-height: normal !important;*/
}

/* 3. FIX: Remove pseudo-element content injection from icon classes */
/* But preserve Kitaboo icon content for specific popup control icons */
#kaltura_video *[class*="icon"]::before,
#kaltura_video *[class*="icon"]::after,
.kaltura-player-container *[class*="icon"]::before,
.kaltura-player-container *[class*="icon"]::after {
/*    content: none !important;*/
}

/* PRESERVE: Kitaboo popup control icons should show their content */
#kaltura_video .icon-AR_close::before,
#kaltura_video .icon-share-icon::before,
#kaltura_video .icon-switch-icon::before {
    content: inherit !important;
}





/* 4. FIX: SVG icon display */
#kaltura_video svg,
.kaltura-player-container svg {
    display: inline-block !important;
    width: 100% !important;
    height: 100% !important;
}

/* 5. FIX: Icon button size only - don't touch display */
/* Ensure icons have proper size */
.playkit-icon {
/*    width: 1em !important;
    height: 1em !important;
    font-size: 24px !important;*/
}

/* CRITICAL: No display overrides - let Kaltura's JS handle ALL visibility */
/* The player uses inline styles and classes to toggle play/pause automatically */

/* 6. FIX: Control bar show/hide on hover */
.playkit-player:hover .playkit-control-bar {
    opacity: 1 !important;
    visibility: visible !important;
}

/* 7. FIX: Hover animations */
.playkit-control-button:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

.playkit-control-button:hover .playkit-icon {
    transform: scale(1.1) !important;
}

.playkit-control-button:active .playkit-icon {
    transform: scale(0.95) !important;
}

/* 8. FIX: Tooltip delayed appearance */
.playkit-player .playkit-tooltip {
    transition: opacity 0.3s ease !important;
}

/* 9. FIX: Cursor styles */
.playkit-control-button {
    cursor: pointer !important;
}

.playkit-player[class*="playkit-state-"] .playkit-big-play-button {
    cursor: pointer !important;
}

/* PRESERVE: Elements with .page-icon class should keep Kitaboo icon styles */
#kaltura_video .page-icon,
.kaltura-player-container .page-icon {
/*    display: block !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    font: normal normal normal 20px kitabooread !important;
    cursor: pointer !important;
    justify-content: center !important;
    line-height: 50px !important;*/
}

/* PRESERVE: Kitaboo popup control icons need kitabooread font for their content */
#kaltura_video .icon-AR_close,
#kaltura_video .icon-share-icon,
#kaltura_video .icon-switch-icon {
/*    font-family: kitabooread !important;*/
}