@font-face{font-family:Kalam;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/kalam-latin-400-normal-BthBl_aR.woff2) format("woff2"),url(/assets/kalam-latin-400-normal-Bl-H2BUA.woff) format("woff")}@font-face{font-family:Kalam;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/kalam-latin-ext-400-normal-DtcdGa4L.woff2) format("woff2"),url(/assets/kalam-latin-ext-400-normal-AcQmRO9z.woff) format("woff")}@font-face{font-family:Kalam;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/kalam-latin-700-normal-D2H-9ISU.woff2) format("woff2"),url(/assets/kalam-latin-700-normal-7TSuSrjP.woff) format("woff")}@font-face{font-family:Kalam;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/kalam-latin-ext-700-normal-CwgfRD_T.woff2) format("woff2"),url(/assets/kalam-latin-ext-700-normal-BA-KJHgr.woff) format("woff")}:root{--primary-bg: rgb(250 248 248);--secondary-bg: rgb(251 251 248);--modal-bg: rgb(241 241 240);--text-color: rgb(0 0 0);--accent-color: rgb(192 57 57);--button-border: rgb(78 77 77);--button-hover-bg: rgb(233 232 232);--ingredient-hover: rgb(75 77 58);--error-color: red;--font-family: "Kalam", cursive;--font-size-tiny: .75rem;--font-size-small: .875rem;--font-size-base: 1rem;--font-size-large: 1.5rem;--font-size-title: 4rem;--font-size-modal-close: 1.375rem;--spacing-xss: .25rem;--spacing-xs: .375rem;--spacing-sm: .5rem;--spacing-md: .625rem;--spacing-lg: 1rem;--spacing-xl: 1.25rem;--spacing-xxl: 1.5rem;--border-radius-sm: .25rem;--border-radius-md: .375rem;--border-radius-lg: .5rem;--border-radius-xl: .625rem;--border-width: .125rem;--border-thin: .0625rem;--recipe-size: 20rem;--common-transition: .2s ease}*{box-sizing:border-box}body{background-color:var(--primary-bg);font-family:var(--font-family);display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0}.sr-only{position:absolute!important;width:.0625rem!important;height:.0625rem!important;padding:0!important;margin:-.0625rem!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}.recipes-app{max-width:70rem}.app-header{text-align:center;position:relative}.app-header-title{font-size:var(--font-size-title);font-weight:700;margin:var(--spacing-lg) 0 var(--spacing-lg)}.app-header-search-section{display:flex;justify-content:center;flex-wrap:wrap}.app-header-search-section>*{margin-inline:var(--spacing-xss);margin-bottom:var(--spacing-sm)}.search-input{background-color:var(--secondary-bg);font-family:inherit;width:var(--recipe-size);font-size:var(--font-size-base);padding:var(--spacing-sm) var(--spacing-md);border:var(--border-width) solid var(--text-color);border-radius:var(--border-radius-lg);outline:none}.btn{background-color:var(--secondary-bg);cursor:pointer;font-family:inherit;font-weight:700;border:var(--border-width) solid var(--text-color);border-radius:var(--border-radius-md);outline:none;transition:color var(--common-transition),border-color var(--common-transition),transform .1s ease}.btn:hover{color:var(--accent-color);border-color:var(--accent-color)}.btn:active{transform:scale(.98)}.btn-primary{font-size:var(--font-size-base);padding:var(--spacing-sm)}.btn-primary-icon{font-size:var(--font-size-small);margin-left:var(--spacing-xs)}.btn-submit{font-size:var(--font-size-base);border:var(--border-width) solid var(--button-border);border-radius:var(--border-radius-sm);padding:var(--spacing-sm) 0;margin:var(--spacing-xss) 0;transition:background-color var(--common-transition),transform .1s ease}.btn-submit:hover{background-color:var(--button-hover-bg);color:initial;border-color:var(--button-border)}.tags{display:flex;justify-content:center;flex-wrap:wrap}.tag{padding-inline:var(--spacing-sm);margin-inline:var(--spacing-xss);cursor:pointer;border:var(--border-width) solid var(--text-color);border-radius:var(--border-radius-xl);margin-bottom:var(--spacing-xss);transition:color var(--common-transition),border-color var(--common-transition)}.tag:hover{color:var(--accent-color);border-color:var(--accent-color)}.tag-selected{background-color:var(--text-color);color:#fff}.tag-selected:hover{color:var(--accent-color);border-color:var(--accent-color)}.recipes{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;padding:var(--spacing-xl)}.recipe-card{cursor:pointer;position:relative;margin:var(--spacing-md);border:var(--border-width) solid var(--text-color);border-radius:var(--border-radius-xl);padding:0 var(--spacing-lg);height:var(--recipe-size);width:var(--recipe-size);overflow:hidden;transition:color var(--common-transition),border-color var(--common-transition)}.recipe-card:hover{color:var(--accent-color);border-color:var(--accent-color)}.recipe-card:hover:has(.recipe-card-action-delete:hover),.recipe-card:hover:has(.recipe-card-action-edit:hover){color:initial;border-color:var(--text-color)}.recipe-card-title{text-align:center;font-size:var(--font-size-large);margin-top:.75rem}.recipe-card-image{position:absolute;left:50%;bottom:1.875rem;height:60%;width:60%;object-fit:cover;border-radius:var(--border-radius-xl);transform:translate(-50%)}.recipe-card-action{position:absolute;cursor:pointer;bottom:var(--spacing-md);color:initial;transition:color var(--common-transition)}.recipe-card-action:hover{color:var(--accent-color)}.recipe-card-action-delete{right:1.875rem}.recipe-card-action-edit{right:var(--spacing-md)}.modal-close-btn{position:absolute;top:var(--spacing-sm);right:var(--spacing-lg);cursor:pointer;font-size:var(--font-size-modal-close)}.recipe-dialog{background-color:var(--modal-bg)!important}.modal{display:flex;flex-direction:column;background-color:var(--modal-bg);padding:var(--spacing-lg)}.modal-title{text-transform:uppercase;font-size:var(--font-size-large)}.form-input{background-color:var(--secondary-bg);font-family:inherit;font-size:var(--font-size-base);margin:var(--spacing-xss) 0;padding:var(--spacing-xss);border:var(--border-thin) solid var(--text-color);border-radius:var(--border-radius-sm);outline:none}.form-input-error{border-color:var(--error-color)}.form-input-ingredients{width:100%}.form-input-textarea{resize:none;height:16rem;min-height:16rem}.ingredients{display:flex;flex-direction:column}.ingredient{position:relative;width:40%}.ingredient-remove-btn{position:absolute;top:33%;right:5%;cursor:pointer;font-size:var(--font-size-tiny);transition:color var(--common-transition)}.ingredient-add-btn{position:absolute;top:22%;right:-12%;cursor:pointer;font-size:1.25rem;transition:color var(--common-transition)}.ingredient-add-btn:hover,.ingredient-remove-btn:hover{color:var(--ingredient-hover)}.tag-form-list{display:flex;flex-wrap:wrap}.tag-form-list-item{margin-right:var(--spacing-lg)}.error-message{color:var(--error-color);text-align:center;font-size:var(--font-size-small);font-weight:700}.recipe-details-ingredients{margin:var(--spacing-lg) 0}.recipe-details-directions{margin:var(--spacing-lg) 0;white-space:pre-wrap}
