:root{--prime-blue: #147bce;--dull-blue: #235366;--dark-blue: #0c295d;--card-background: whitesmoke;--font-color: black;--light-prime-gray: #33373d}[data-theme=light]{--prime-blue: #147bce;--dull-blue: #235366;--dark-blue: #ffffff;--light-prime-gray: #e6ecf5;--card-background: #235366;--font-color: black}body{margin:0;padding:0}img{max-width:100%;height:auto}#app-wrapper{background-color:var(--dark-blue)}.navbar-wrapper{display:flex;justify-content:space-around;border:1px solid var(--dull-blue);padding:1rem;align-items:center;background-color:var(--dull-blue);color:#fff}.navbar-wrapper div:nth-child(1){font-size:large;letter-spacing:1px}.navbar-wrapper div:nth-child(2){flex-basis:56%}.navbar-wrapper div:nth-child(2) input{width:100%;padding:5px;background-color:var(--light-prime-gray);border:none;border-radius:3px;height:34px;color:var(--font-color)}.search-bar{position:relative}#result-list{display:none;position:absolute;background-color:#f5f5f5;font-size:medium;color:#000;width:100%;max-height:400px;overflow-y:scroll;border-radius:10px;border:1px solid var(--light-prime-gray)}#result-list>.autocomplete-result{font-size:medium;letter-spacing:0;margin-bottom:1rem;padding:1rem;border-bottom:1px solid black}.movie-base-title>a{color:#fff;text-decoration:none}.autocomplete-result:hover{background-color:beige}.theme-icon{margin-left:1rem;font-size:x-large;cursor:pointer}.movie-wrapper{display:flex;flex-direction:column;border:1px solid white;padding:10px;align-items:center;border-radius:10px;background-color:var(--card-background);max-width:22%;min-width:300px;text-align:center;margin-bottom:1.2rem;color:var(--font-color);cursor:pointer}.movie-title{margin-top:1rem;font-size:x-large;letter-spacing:2px}.movie-year,.movie-type{font-size:larger;margin-top:.6rem}.movie-card-wrapper{display:flex;justify-content:space-evenly;margin-top:2rem;flex-wrap:wrap}.movie-details-wrapper{display:flex;justify-content:space-evenly;align-items:center;margin:0 auto;margin-top:3rem;flex-wrap:wrap}.movie-card{flex-basis:40%}.movie-details{color:#fff;flex-basis:50%;font-size:x-large;display:flex;flex-direction:column;gap:2rem;margin-top:3rem}.movie-details div:nth-child(3){display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:1rem}.genre{border:1px solid var(--dull-blue);background-color:var(--dull-blue);margin-right:1rem;border-radius:20px;padding:10px 20px}.rr--group{display:flex;width:100%;position:relative}.rr--box{display:flex;width:100%;flex-grow:1;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rr--svg{display:flex;aspect-ratio:1;width:100%;flex-grow:1;overflow:clip;pointer-events:none}@supports not (overflow: clip){.rr--svg{overflow:auto}}.rr--box:focus,.rr--box:focus-visible,.rr-reset:focus-visible,.rr-reset:focus{outline:none;box-shadow:none}.rr--focus-reset{outline:6px double #0079ff}.rr--box:focus-visible .rr--svg{outline:6px double #0079ff;isolation:isolate}.rr--reset{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;right:0;bottom:50%}[dir=rtl] .rr--reset{left:0;right:auto}.rr--dir-y .rr--reset{bottom:0;right:50%}.rr--disabled{opacity:.5;cursor:not-allowed}.rr--disabled .rr--svg{pointer-events:none}.rr--pointer .rr--box{cursor:pointer}.rr--dir-x{flex-direction:row}.rr--dir-y{flex-direction:column}.rr--space-sm .rr--svg{padding:8%}.rr--space-md .rr--svg{padding:12.5%}.rr--space-lg .rr--svg{padding:17.5%}.rr--dir-x.rr--gap-sm .rr--svg{margin:0 6.25%}.rr--dir-x.rr--gap-sm .rr--box:focus-visible:after{width:87.5%;left:6.25%}.rr--dir-x.rr--gap-md .rr--svg{margin:0 12.5%}.rr--dir-x.rr--gap-md .rr--box:focus-visible:after{width:75%;left:12.5%}.rr--dir-x.rr--gap-lg .rr--svg{margin:0 25%}.rr--dir-x.rr--gap-lg .rr--box:focus-visible:after{width:50%;left:25%}.rr--dir-y.rr--gap-sm .rr--svg{margin:6.25% 0}.rr--dir-y.rr--gap-md .rr--svg{margin:12.5% 0}.rr--dir-y.rr--gap-lg .rr--svg{margin:25% 0}.rr--rx-sm .rr--svg{border-radius:5%}.rr--rx-md .rr--svg{border-radius:15%}.rr--rx-lg .rr--svg{border-radius:20%}.rr--rx-full .rr--svg{border-radius:100%}.rr--has-stroke .rr--svg{stroke-linecap:round;stroke-linejoin:round}.rr--has-border .rr--svg{border-width:var(--rr--border-width);border-style:solid}.rr--on .rr--svg{fill:var(--rr--fill-on-color, none)}.rr--off .rr--svg{fill:var(--rr--fill-off-color, none)}.rr--has-stroke .rr--on .rr--svg{stroke:var(--rr--stroke-on-color, currentColor)}.rr--has-stroke .rr--off .rr--svg{stroke:var(--rr--stroke-off-color, currentColor)}.rr--on .rr--svg{background-color:var(--rr--box-on-color, none)}.rr--off .rr--svg{background-color:var(--rr--box-off-color, none)}.rr--has-border .rr--off .rr--svg{border-color:var(--rr--border-off-color, currentColor)}.rr--has-border .rr--on .rr--svg{border-color:var(--rr--border-on-color, currentColor)}.rr--fx-colors{--rr--easing: .2s cubic-bezier(.61, 1, .88, 1)}.rr--fx-colors .rr--svg{transition-duration:.2s;transition-timing-function:var(--rr--easing);transition-property:background-color,border-color,fill,stroke}.rr--fx-opacity .rr--off{opacity:.35;transition:opacity var(--rr--easing)}.rr--fx-opacity .rr--on{opacity:1}@media (hover: hover){.rr--fx-opacity .rr--box:hover{opacity:1}}@media (hover: hover){.rr--fx-zoom .rr--box{transition:transform var(--rr--easing);transform:scale(1)}.rr--fx-zoom .rr--box:hover{transform:scale(1.2)}@media (prefers-reduced-motion){.rr--fx-zoom .rr--box:hover{transform:scale(1)}}}@media (hover: hover){.rr--fx-position .rr--box{transition:transform var(--rr--easing);transform:translateY(0)}.rr--fx-position .rr--box:hover{transform:translateY(-15%)}@media (prefers-reduced-motion){.rr--fx-position .rr--box:hover{transform:translateY(0)}}}.rr--svg-stop-1{stop-color:var(--rr--fill-on-color, rgba(0, 0, 0, 0))}[dir=rtl] .rr--svg-stop-1,.rr--svg-stop-2{stop-color:var(--rr--fill-off-color, rgba(0, 0, 0, 0))}[dir=rtl] .rr--svg-stop-2{stop-color:var(--rr--fill-on-color, rgba(0, 0, 0, 0))}.rr--hf-svg-on{fill:var(--rr--fill-on-color, none)}.rr--hf-svg-off{fill:var(--rr--fill-off-color, none)}.rr--has-stroke .rr--hf-svg-on{stroke:var(--rr--stroke-on-color, currentColor)}.rr--has-stroke .rr--hf-svg-off{stroke:var(--rr--stroke-off-color, currentColor)}.rr--hf-svg-on .rr--svg,.rr--hf-svg-off .rr--svg{background-color:var(--rr--box-off-color, none)}.rr--has-border .rr--hf-svg-on .rr--svg{border-color:var(--rr--border-on-color, currentColor)}.rr--has-border .rr--hf-svg-off .rr--svg{border-color:var(--rr--border-off-color, currentColor)}.rr--dir-x .rr--hf-box-int .rr--svg{background:linear-gradient(to right,var(--rr--box-on-color, none) 50%,var(--rr--box-off-color, none) 50%)}[dir=rtl] .rr--dir-x .rr--hf-box-int .rr--svg{background:linear-gradient(to left,var(--rr--box-on-color, none) 50%,var(--rr--box-off-color, none) 50%)}.rr--dir-y .rr--hf-box-int .rr--svg{background:linear-gradient(to bottom,var(--rr--box-on-color, none) 50%,var(--rr--box-off-color, none) 50%)}.rr--hf-box-on .rr--svg{background-color:var(--rr--box-on-color, none)}.rr--hf-box-off .rr--svg{background-color:var(--rr--box-off-color, none)}.rr--hf-box-on .rr--svg,.rr--hf-box-off .rr--svg,.rr--hf-box-int .rr--svg{fill:var(--rr--fill-off-color, none)}.rr--has-stroke .rr--hf-box-on .rr--svg,.rr--has-stroke .rr--hf-box-off .rr--svg,.rr--has-stroke .rr--hf-box-int .rr--svg{stroke:var(--rr--stroke-off-color, currentColor)}.rr--has-border .rr--hf-box-on .rr--svg,.rr--has-border .rr--hf-box-int .rr--svg{border-color:var(--rr--border-on-color, currentColor)}.rr--has-border .rr--hf-box-off .rr--svg{border-color:var(--rr--border-off-color, currentColor)}
