*{box-sizing:border-box}body{background-color:#fff;margin:0;font-family:Arial,Helvetica,sans-serif}.auth-container{width:100%;min-height:100vh;display:flex}.auth-image{width:50%;min-height:100vh;position:relative;overflow:hidden}.background-image{object-fit:cover;background-image:url(/image/auth-bg.png);background-position:50%;background-size:cover;width:100%;height:100%;position:absolute;inset:0}.image-overlay{background:#f4c600b8;position:absolute;inset:0}.brand{color:#fff;text-align:center;z-index:2;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.brand-icon{max-width:120px}.brand h5{margin:0;font-size:13px;font-weight:600}.auth-form-wrapper{background-color:#fff;justify-content:center;align-items:center;width:50%;min-height:100vh;display:flex}.auth-form{width:100%;max-width:360px;padding:30px}.auth-form h3{text-align:center;color:#f3c400;margin-bottom:6px;font-size:25px;font-weight:700}.subtitle{text-align:center;color:#999;margin-bottom:28px;font-size:14px}.form-label{color:#777;margin-bottom:5px;font-size:12px}.form-control{box-shadow:none;border:1px solid #d9d9d9;border-radius:6px;padding:10px 12px;font-size:14px}.form-control:focus{border-color:#f3c400;box-shadow:0 0 0 .15rem #f3c40026}.form-control::placeholder{color:#bcbcbc}.btn-auth{color:#fff;background-color:#f3c400;border:none;border-radius:3px;height:36px;font-size:12px;font-weight:500}.btn-auth:hover{color:#fff;background-color:#ddb300}.bottom-auth{text-align:center;color:#999;margin-top:15px;font-size:11px}.bottom-auth a{color:#f3c400;font-weight:600;text-decoration:none}.bottom-auth a:hover{text-decoration:underline}@media (width<=768px){.auth-image{display:none}.auth-form-wrapper{width:100%}.auth-form{max-width:400px;padding:35px}}.bg-yellow{background-color:#efc81a}.box{box-shadow:1px 1px 5px 1px #00000080}.nav-pointer{cursor:pointer}.img-nav{object-fit:cover;width:30px;height:30px}.btn-yellow{color:#fff;background-color:#efc81a}.nav-link{color:#333;transition:all .2s;position:relative;padding:5px 15px!important}.nav-link:hover{text-shadow:1px 1px 1px #0000004d;transform:scale(1.1)}.nav-link-active{font-weight:500;color:#333!important}.nav-link-active:after{content:"";background-color:#efc81a;border-radius:3px;width:25px;height:3px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.loading{max-width:10%}.loadingvh{height:70vh}.not-found{max-width:20%}.small-loading{max-width:4%}.hero-section{width:100%;min-height:620px;position:relative;overflow:hidden}.hero-yellow{z-index:0;background-color:#f7d313;width:30%;height:100%;position:absolute;bottom:0;right:0}.hero-container{z-index:2;min-height:620px;position:relative}.hero-content{z-index:5;padding-left:25px;position:relative}.hero-content h1{color:#332878;margin:0 0 25px;font-size:42px;font-weight:700;line-height:1.18}.hero-search{background-color:#fff;align-items:center;width:375px;height:52px;padding:0 18px;display:flex;box-shadow:0 2px 8px #00000008}.hero-search i{color:#b7b7b7;margin-right:10px;font-size:14px}.hero-search input{color:#555;background:0 0;border:none;outline:none;width:100%;font-size:12px}.hero-search input::placeholder{color:#999}.hero-image-wrapper{justify-content:center;align-items:center;width:100%;height:620px;display:flex;position:relative}.hero-food{z-index:4;object-fit:contain;filter:drop-shadow(10px 18px 18px #00000026);width:500px;max-width:125%;position:relative}.hero-dots{z-index:1;opacity:.75;width:290px;position:absolute;top:55px;right:42%}.list-recipe-section{width:100%;padding:70px 0 80px}.list-recipe-title{border-left:12px solid #f7d313;align-items:center;height:72px;margin-bottom:55px;padding-left:15px;display:flex}.list-recipe-title h2{color:#3d3d3d;margin:0;font-size:28px;font-weight:600}.list-recipe-card{cursor:pointer;background-color:#eee;border-radius:8px;width:100%;height:255px;position:relative;overflow:hidden}.list-recipe-image{object-fit:cover;width:100%;height:100%;transition:transform .3s;display:block}.list-recipe-overlay{background:linear-gradient(#0000,#0000000d 40%,#000000bf);position:absolute;inset:0}.list-recipe-name{color:#fff;margin:0;font-size:18px;font-weight:500;line-height:1.2;position:absolute;bottom:18px;left:20px}.list-recipe-card:hover .list-recipe-image{transform:scale(1.05)}.save-recipe-button{color:#555;cursor:pointer;z-index:3;background-color:#fffffff2;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;display:flex;position:absolute;top:12px;right:12px;box-shadow:0 2px 6px #0000001f}.save-recipe-button:hover{color:#fff;background-color:#f7d313}@media (width<=1200px){.hero-content h1{font-size:38px}.hero-food{width:520px}.hero-dots{width:250px;right:39%}}@media (width<=992px){.hero-section{min-height:auto;padding:60px 0 80px}.hero-container{min-height:auto}.hero-yellow{width:35%}.hero-content{text-align:center;padding-left:10px}.hero-content h1{font-size:36px}.hero-search{width:350px;margin:0 auto}.hero-image-wrapper{height:450px;margin-top:20px}.hero-food{width:500px;max-width:100%}.hero-dots{width:230px;top:430px;right:20%}}@media (width<=768px){.list-recipe-section{padding:50px 0 60px}.list-recipe-title{border-left-width:8px;height:60px;margin-bottom:35px;padding-left:12px}.list-recipe-title h2{font-size:24px}.list-recipe-card{height:230px}}@media (width<=576px){.hero-section{padding:45px 0 50px}.hero-yellow{width:45%;height:55%}.hero-content{padding:0 15px}.hero-content h1{font-size:30px;line-height:1.2}.hero-search{width:100%;height:48px}.hero-image-wrapper{height:320px;margin-top:10px}.hero-food{width:380px;max-width:110%}.hero-dots{width:180px;top:400px;right:7%}.list-recipe-section{padding:40px 0 50px}.list-recipe-title{height:50px;margin-bottom:25px}.list-recipe-title h2{font-size:21px}.list-recipe-card{height:220px}}.recipe-banner{width:100%;height:270px;margin-bottom:30px;position:relative;overflow:hidden}.recipe-banner-image{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.recipe-banner-overlay{background:linear-gradient(90deg,#f4be14f2 0%,#f4be14d9 35%,#f4be1459 65%,#0000000d 100%);position:absolute;inset:0}.recipe-banner-content{z-index:2;color:#fff;flex-direction:column;justify-content:center;height:100%;padding-left:45px;display:flex;position:relative}.recipe-banner-content h1{margin:0 0 12px;font-size:36px;font-weight:700;line-height:1.15}.recipe-banner-content p{color:#fffffff2;margin:0;font-size:15px;font-weight:400;line-height:1.5}@media (width<=992px){.recipe-banner{height:230px}.recipe-banner-content{padding-left:30px}.recipe-banner-content h1{font-size:30px}.recipe-banner-content p{font-size:13px}}@media (width<=576px){.recipe-banner{height:190px}.recipe-banner-content{padding:20px}.recipe-banner-content h1{font-size:23px}.recipe-banner-content p{font-size:11px}}.profile-page{background-color:#fdfdf4;width:100%;min-height:100vh;overflow-x:hidden}.profile-info{z-index:5;flex-direction:column;align-items:center;margin-top:-90px;display:flex;position:relative}.profile-photo-wrapper{width:115px;height:115px;position:relative}.profile-photo{object-fit:cover;border:4px solid #fff;border-radius:50%;width:115px;height:115px}.edit-profile-button{color:#f4c400;background-color:#fff;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:10px;display:flex;position:absolute;bottom:5px;right:-2px;box-shadow:0 2px 5px #0000001a}.profile-name{text-align:center;color:#222;border-bottom:1px solid #eee;min-width:100px;margin-top:8px;margin-bottom:15px;padding-bottom:5px;font-size:16px;font-weight:600}.profile-tabs{border-bottom:1px solid #eee;gap:55px;width:100%;padding-left:20px;display:flex}.profile-tab{color:#777;background:0 0;border:none;padding:14px 0 15px;font-size:14px;position:relative}.profile-tab.active{color:#f4b900;font-weight:600}.profile-tab.active:after{content:"";background-color:#f4b900;height:2px;position:absolute;bottom:-1px;left:0;right:0}.recipe-list{padding:20px 8px 35px}.recipe-card{background-color:#fff;border:1px solid #eee;border-radius:8px;width:100%;overflow:hidden;box-shadow:0 2px 6px #0000000f}.recipe-image-wrapper{width:100%;height:150px;position:relative;overflow:hidden}.recipe-image{object-fit:cover;width:100%;height:100%;display:block}.recipe-actions{gap:7px;display:flex;position:absolute;top:9px;right:9px}.recipe-action{border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:12px;display:flex}.recipe-action.edit{color:#777;background-color:#fff}.recipe-action.delete{color:#fff;background-color:#ff6868}.recipe-info{padding:12px 14px 13px}.recipe-name{color:#333;white-space:nowrap;text-overflow:ellipsis;margin:0 0 10px;font-size:15px;font-weight:600;overflow:hidden}.recipe-meta{color:#777;align-items:center;gap:22px;font-size:11px;display:flex}.recipe-meta span{align-items:center;gap:6px;display:flex}.recipe-meta i{color:#777;font-size:14px}@media (width<=768px){.profile-banner{height:120px}.profile-info{margin-top:-45px}.profile-photo-wrapper,.profile-photo{width:95px;height:95px}.profile-tabs{gap:35px}.recipe-image-wrapper{height:160px}.recipe-name{font-size:14px}.recipe-meta{font-size:10px}}@media (width<=576px){.profile-banner{border-radius:0;height:100px}.profile-info{margin-top:-38px}.profile-photo-wrapper,.profile-photo{width:76px;height:76px}.edit-profile-button{width:23px;height:23px;font-size:9px}.profile-tabs{gap:25px;padding-left:15px}.recipe-list{padding:15px 10px}.recipe-image-wrapper{height:125px}}.recipe-detail-page{color:#252525;background-color:#fff;width:100%;min-height:100vh;padding-bottom:60px}.recipe-detail-container{max-width:1000px;padding-top:30px}.recipe-heading{text-align:center;margin-bottom:25px}.recipe-heading h1{color:#222;margin:0 0 12px;font-size:36px;font-weight:700}.category-badge{color:#8c6900;background-color:#fff6d9;border-radius:20px;align-items:center;gap:7px;padding:7px 15px;font-size:13px;font-weight:500;display:inline-flex}.category-badge i{color:#f4b900}.recipe-hero{border-radius:12px;width:100%;height:360px;margin-bottom:35px;overflow:hidden}.recipe-hero img{object-fit:cover;width:100%;height:100%;display:block}.recipe-section{margin-bottom:30px}.section-title{align-items:center;gap:12px;margin-bottom:12px;display:flex}.section-icon{color:#dca900;background-color:#fff0b8;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;font-size:17px;display:flex}.section-title h2{color:#252525;margin:0;font-size:22px;font-weight:700}.section-content{background-color:#fffaf0;border-radius:10px;margin-left:50px;padding:20px 25px}.description-content p{color:#666;margin:0;font-size:14px;line-height:1.7}.ingredients-list{margin:0;padding-left:20px}.ingredients-list li{color:#555;font-size:14px;line-height:1.8}.ingredients-list li::marker{color:#f4b900}.instructions-list{counter-reset:instruction;margin:0;padding-left:32px}.instructions-list li{color:#555;margin-bottom:14px;padding-left:5px;font-size:14px;line-height:1.7}.instructions-list li:last-child{margin-bottom:0}.instructions-list li::marker{color:#f4b900;font-weight:700}.recipe-author{border-top:1px solid #eee;align-items:center;gap:12px;margin-top:40px;margin-left:50px;padding-top:20px;display:flex}.author-label{color:#999;margin-bottom:2px;font-size:11px;display:block}.recipe-author h6{color:#333;margin:0;font-size:14px;font-weight:600}@media (width<=768px){.recipe-detail-container{padding-left:20px;padding-right:20px}.recipe-heading h1{font-size:30px}.recipe-hero{height:280px}.section-content,.recipe-author{margin-left:0}}@media (width<=576px){.recipe-detail-container{padding-top:20px}.recipe-heading{text-align:left}.recipe-heading h1{font-size:26px}.recipe-hero{border-radius:8px;height:220px}.section-title h2{font-size:19px}.section-icon{width:34px;height:34px;font-size:15px}.section-content{padding:15px 18px}}body{background-color:#fdfdf4}
