.search-recommendation{background-color:var(--background);border:1px solid var(--gray-alpha-300);z-index:11;box-sizing:border-box;border-radius:12px;flex-direction:column;gap:1.5rem;width:100%;max-height:80vh;margin-top:.25rem;padding:1.25rem;display:flex;position:absolute;top:100%;right:0;overflow-y:auto;box-shadow:0 4px 12px #0000001a}.search-recommendation .title{justify-content:space-between;align-items:center;margin-bottom:.75rem;font-size:14px;font-weight:600;display:flex}.search-recommendation .title .delete-btn{color:var(--gray-alpha-500);cursor:pointer;align-items:center;gap:4px;font-size:12px;display:flex}.search-recommendation .title .delete-btn.disabled{opacity:.5;cursor:default}.search-recommendation .suggested-list{gap:1.5rem;display:flex}.search-recommendation .suggested-list .left-column,.search-recommendation .suggested-list .right-column{flex-direction:column;flex:1;gap:8px;display:flex}.search-recommendation .suggested-item{cursor:pointer;border-radius:8px;justify-content:space-between;align-items:center;padding:.5rem 0;transition:all .2s;display:flex}.search-recommendation .suggested-item .item-title{align-items:center;gap:12px;display:flex}.search-recommendation .suggested-item .item-title .rank{background-color:var(--gray-alpha-200);border-radius:4px;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;font-weight:700;display:flex}.search-recommendation .suggested-item .item-title:nth-child(-n+3) .rank{background-color:var(--primary-color);color:#fff}.search-recommendation .suggested-item .item-title p{margin:0;font-size:14px}.search-recommendation .suggested-item .status-icon{font-size:12px}.search-recommendation .suggested-item .status-icon.up{color:var(--red-color)}.search-recommendation .suggested-item .status-icon.down{color:var(--done-color);transform:rotate(180deg)}.search-recommendation .suggested-item .status-icon.same{color:var(--gray-alpha-400)}.search-recommendation .suggested-item .status-icon.new{color:var(--red-color);font-weight:700}.search-recommendation .history-list{flex-wrap:wrap;gap:8px;display:flex}.search-recommendation .history-list .history-label{font-size:14px}.search-recommendation .history-list .history-delete-icon{font-size:14px!important}.search-recommendation .no-history{color:var(--gray-alpha-500);padding:.5rem 0;font-size:13px}.search-recommendation .close-btn{border:1px solid var(--gray-alpha-300);cursor:pointer;border-radius:8px;align-self:center;padding:.5rem 1.5rem;font-size:13px}@media (max-width:1179px){.search-recommendation{box-shadow:none;width:100vw;height:fit-content;left:0;right:0;top:var(--header-height);border:none;border-radius:0;margin-top:0;padding:1rem;position:fixed}.search-recommendation .suggested-list{flex-direction:column;gap:0}}@media (hover:hover) and (pointer:fine){.search-recommendation .title .delete-btn:hover{color:var(--primary-color)}.search-recommendation .title .delete-btn:hover.disabled{color:var(--gray-alpha-500)}.search-recommendation .suggested-item:hover{background-color:var(--gray-alpha-200);margin-left:-.5rem;margin-right:-.5rem;padding-left:.5rem;padding-right:.5rem}.search-recommendation .close-btn:hover{background-color:var(--gray-alpha-100)}}
header{z-index:10;width:100%;height:var(--header-height);color:var(--foreground);background:var(--background);box-shadow:0 1px 4px var(--gray-alpha-200);flex-direction:column;justify-content:center;align-items:center;transition:box-shadow .2s,transform .3s;display:flex;position:fixed;top:0}header.top{box-shadow:0 1px #0000}header.hidden{transform:translateY(calc(var(--header-height)*-1))}header .main-header{background-color:var(--background);flex-direction:row;height:100%;position:relative}header .main-header.full-width{max-width:unset}header .main-header .left-container{align-items:center;gap:.5rem;display:flex}header .main-header .left-container .logo img{margin-left:-.35rem}header .main-header .left-container .logo.hide{display:none}header .main-header .left-container .logo .custom{color:var(--primary-color);margin-left:-.25rem;font-size:1.125rem;font-style:italic;font-weight:700}header .main-header .left-container .back-btn{z-index:1;position:absolute}header .main-header .left-container .back-btn.hide{display:none}header .main-header .left-container .pc-menu{align-items:center;margin-left:1rem;display:flex}header .main-header .left-container .pc-menu .pc-menu-group{align-items:center;display:flex}header .main-header .left-container .pc-menu .pc-menu-group .pc-menu-item{color:var(--foreground);white-space:nowrap;opacity:.8;padding:.25rem 1rem;font-weight:700;transition:opacity .2s}header .main-header .left-container .pc-menu .pc-menu-group .pc-menu-item:hover{opacity:1}header .main-header .right-container{justify-content:flex-end;align-items:center;gap:.25rem;width:100%;transition:padding .2s;display:flex}header .main-header .right-container .menu-btn{background-color:var(--background);border:1px solid var(--gray-alpha-300);box-sizing:border-box;border-radius:.75rem;gap:.5rem;height:calc(2.75rem + 2px);margin-left:.75rem;padding-right:43px;position:relative}header .main-header .right-container .menu-btn.minimal{padding-right:8px}header .main-header .right-container .menu-btn.minimal .user-icon{display:none}header .main-header .right-container .menu-btn.login-btn{color:var(--foreground);border:1px solid var(--gray-alpha-300);background-color:#0000;padding:0 1.25rem;font-weight:600;transition:all .2s}header .main-header .right-container .menu-btn.login-btn .login-text{font-size:.9375rem}header .main-header .right-container .menu-btn .menu-icon{color:var(--icon-color)}header .main-header .right-container .menu-btn .user-icon{border:1px solid var(--gray-alpha-300);border-radius:50%;flex-shrink:0;position:absolute;top:50%;right:8px;transform:translateY(-50%)}header .main-header .right-container .menu-btn .user-icon.shop-owner{background:linear-gradient(var(--background),var(--background))padding-box,linear-gradient(45deg,var(--primary-color)0%,#ffb703 50%,var(--primary-color)100%)border-box;border:2px solid #0000;padding:2px}header .main-header .right-container .menu-btn .user-icon.manager{background:linear-gradient(var(--background),var(--background))padding-box,linear-gradient(45deg,var(--blue-color)0%,#b000c7 50%,var(--blue-color)100%)border-box;border:2px solid #0000;padding:2px}.user-location{border:1px solid var(--gray-alpha-300);background:var(--icon-color);color:var(--background);opacity:.2;border-radius:.75rem;align-items:center;gap:.125rem;padding:.25rem 1rem .25rem .75rem;transition:opacity .2s;display:flex;position:absolute;top:1.25rem;left:1rem}.user-location.active{opacity:.5}.user-location .icon{font-size:1.25rem}.main-menu .menu-top{align-items:center;gap:1rem;padding:1.5rem 1rem;display:flex}.main-menu .menu-top .login-btn{color:var(--foreground);border:1px solid var(--gray-alpha-200);background-color:#0000;border-radius:.75rem;gap:.75rem;width:100%;padding:.875rem 1rem;font-size:1rem;font-weight:600;transition:all .2s}.main-menu .menu-top .user-profilie{border:1px solid var(--gray-alpha-300);border-radius:50%;flex-shrink:0}.main-menu .menu-top .user-profilie.shop-owner{background:linear-gradient(var(--background),var(--background))padding-box,linear-gradient(45deg,var(--primary-color)0%,#ffb703 50%,var(--primary-color)100%)border-box;border:2px solid #0000;padding:2px}.main-menu .menu-top .user-profilie.manager{background:linear-gradient(var(--background),var(--background))padding-box,linear-gradient(45deg,var(--blue-color)0%,#b000c7 50%,var(--blue-color)100%)border-box;border:2px solid #0000;padding:2px}.main-menu .menu-top .user-wrapper{flex-direction:column;display:flex}.main-menu .menu-top .user-wrapper .user-name{font-size:1.25rem}.main-menu .menu-top .user-wrapper .logout-btn{cursor:pointer;opacity:.7;align-items:center;font-size:.875rem;display:flex}@media (hover:hover) and (pointer:fine){header .main-header .right-container .menu-btn:not(.login-btn):hover{background-color:var(--icon-hover-color)}header .main-header .right-container .menu-btn.login-btn:hover{background-color:var(--gray-alpha-100);border-color:var(--gray-alpha-400)}}.search-backdrop{top:var(--header-height);z-index:9;opacity:0;visibility:hidden;background-color:#00000073;width:100vw;height:100dvh;transition:opacity .3s,visibility .3s;position:fixed;left:0}.search-backdrop.active{opacity:1;visibility:visible}@media (min-width:1180px){header .main-header .right-container .search-container{position:relative}header .main-header .right-container .search-container.expanded{z-index:12;width:500px}header .main-header .right-container .search-container.expanded .search-recommendation{width:100%}header .main-header .right-container .search-container .search-input{width:100%;padding:0}}@media (max-width:1179px){header .main-header .right-container .search-container.expanded{width:100%}header .main-header .right-container .search-container .search-input{padding:0}}