/**
 * E-Courier Child V3 Theme
 * Based on Argon Theme
 * Extends V2 theme with additional features
 * Applicable on the v3 app version only
 */

/* Import V2 base styles */
@import url('app-theme-v2.css');

/* ==========================================================================
   V3 Banner Media Styles
   For full-bleed video/image backgrounds in login banner
   ========================================================================== */

/* Banner with full-bleed media - removes padding and decorative overlays */
.login-banner.login-banner--media {
    padding: 0;
}

.login-banner.login-banner--media::before,
.login-banner.login-banner--media::after {
    display: none;
}

.login-banner--media .banner-content {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: left;
}

/* Banner media - for videos and images that fill the banner
   Usage: <video class="banner-media" ...> or <img class="banner-media" ...>
*/
.banner-media {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* ==========================================================================
   Banner Media Position Modifiers
   Add these classes to .banner-media to control positioning
   ========================================================================== */

/* Horizontal positions */
.banner-media--left {
    object-position: left center;
}

.banner-media--center {
    object-position: center center;
}

.banner-media--right {
    object-position: right center;
}

/* Vertical positions */
.banner-media--top {
    object-position: center top;
}

.banner-media--bottom {
    object-position: center bottom;
}

/* Corner positions */
.banner-media--top-left {
    object-position: left top;
}

.banner-media--top-right {
    object-position: right top;
}

.banner-media--bottom-left {
    object-position: left bottom;
}

.banner-media--bottom-right {
    object-position: right bottom;
}