form.trhp-pwd-submit {
width: 80dvw;
margin: 100px auto;
padding: 10px;
border: 1px solid #00ac97;
border-radius: 5px;
font-size: 16px;
}
form.trhp-pwd-submit p {
color: #333;
font-size: 14px;
}
form.trhp-pwd-submit button {
padding: 8px 20px;
color: #FFF;
background: #333;
} html {
box-sizing: border-box;
}
*, :after, :before {
box-sizing: inherit;
}
body {
color: #808285;
background: #fff;
font-style: normal;
line-height: 1.85714285714286;
}
address, blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, li, ol, p, pre, textarea, ul {
border: 0;
font-size: 100%;
font-style: inherit;
font-weight: inherit;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
button, html input[type=button], input[type=reset], input[type=submit] {
-webkit-appearance: button;
cursor: pointer;
border: 1px solid;
}
input[type=email], input[type=number], input[type=password], input[type=reset], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea {
color: #666;
padding: .75em;
height: auto;
border-width: 1px;
border-style: solid;
border-color: var(--ast-border-color);
border-radius: 2px;
background: var(--ast-comment-inputs-background);
box-shadow: none;
box-sizing: border-box;
transition: all .2s linear;
}
input[type=search]:focus {
outline: thin dotted;
}
.page-title {
margin-bottom: 1em;
} ::-webkit-scrollbar {
width: 10px;
} ::-webkit-scrollbar-track {
background: #f1f1f1; 
} ::-webkit-scrollbar-thumb {
background: #888; 
} ::-webkit-scrollbar-thumb:hover {
background: #555; 
}
div#loading-overlay { background-image: url(//love.tomarry.net/wp-content/uploads/2025/03/loading_trhp.gif);
background-position: center;
background-color: #ffffffc7;
background-repeat: no-repeat;
background-size: 100px;
z-index: 999;
display: block;
position: fixed;
width: 100vw;
height: 100vh;
}
.popup-overlay {
position: fixed;
width: 100vw;
height: 100vh;
top: 0;
right: 0;
z-index: 999;
background-color: #00000080;
display:none;
}
.popup-overlay.active {
display: block;
}
.popup-close-button {
position: relative;
top: -10px;
left: calc(100% - 20px);
width: 20px;
height: 20px;
z-index: 998;
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24"><path fill="none" stroke="%23000" stroke-linecap="round" stroke-width="2" d="m3 3 18 18M21 3 3 21"></path></svg>');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
cursor: pointer;
}
.popup-container {
display: block;
width: 90vw;
max-width: 600px;
height: max-content;
max-height: 400px;
background-color: #FFF;
margin: 50px auto;
border-radius: 15px;
padding: 30px 20px;
}
div#update-popup-overlay .popup-contain {
padding: 20px;
min-height: 100px;
width: 100%;
height: 300px;
overflow-y: scroll;
overflow-x: hidden;
background-color: #0000001a;
position: relative;
}
div#update-popup-overlay .popup-contain.loading:before {
content: '';
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><radialGradient id="a12" cx=".66" fx=".66" cy=".3125" fy=".3125" gradientTransform="scale(1.5)"><stop offset="0" stop-color="%2300AC97"></stop><stop offset=".3" stop-color="%2300AC97" stop-opacity=".9"></stop><stop offset=".6" stop-color="%2300AC97" stop-opacity=".6"></stop><stop offset=".8" stop-color="%2300AC97" stop-opacity=".3"></stop><stop offset="1" stop-color="%2300AC97" stop-opacity="0"></stop></radialGradient><circle transform-origin="center" fill="none" stroke="url(/wp-content/themes/astra-child/%23a12)" stroke-width="15" stroke-linecap="round" stroke-dasharray="200 1000" stroke-dashoffset="0" cx="100" cy="100" r="70"><animateTransform type="rotate" attributeName="transform" calcMode="spline" dur="2" values="360;0" keyTimes="0;1" keySplines="0 0 1 1" repeatCount="indefinite"></animateTransform></circle><circle transform-origin="center" fill="none" opacity=".2" stroke="%2300AC97" stroke-width="15" stroke-linecap="round" cx="100" cy="100" r="70"></circle></svg>');
background-color: #ffffff80;
background-repeat: no-repeat;
background-position: center;
background-size: 70px;
position: absolute;
top: 0;
right: 0px;
width: 100%;
height: 100%;
}
.popup-contain p {
line-height: 1.5em;
}
p.update-date {
margin-bottom: 5px;
font-weight: 600;
color: #00ac97;
}
p.update-contain {
margin-bottom: 10px;
font-size: 13px;
color: #000000;
font-weight: 300;
} #hire-popup-overlay .popup-container {
max-height: 80vh;
}
#hire-popup-overlay .popup-contain {
height: 70vh;
overflow-y: scroll;
}
#hire-popup-overlay p.title {
font-size: 20px;
font-weight: 600;
color: #000;
} h3.account_title {
font-size: 15px;
color: #00ac97;
margin-top: 20px;
padding-top: 10px;
border-top: 1px solid #d6d6d6;
}
ul#my_malicious_lists {
list-style: none;
margin: 20px 0px 0px;
max-height: 50vh;
height: 30vh;
min-height: 200px;
overflow-y: scroll;
}
li.malicious_item {
font-size: 14px;
font-family: 'Noto Sans TC', 'Noto Sans SC';
border-radius: 8px;
border: 1px solid #d6d6d6;
padding: 6px;
margin: 5px 0px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-content: flex-start;
justify-content: flex-start;
align-items: center;
column-gap: 20px;
position: relative;
}
li.malicious_item:after {
padding: 0px 12px;
border-radius: 15px;
font-size: 12px;
color: #FFF;
position: absolute;
top: 5px;
right: 5px;
}
li.malicious_item.marked:after {
content: '已標記';
background-color: #721c24;
}
li.malicious_item.cancled:after {
content: '已移除';
background-color: #777777;
}
ul#my_malicious_lists  span.update_at {
font-size: 12px;
width: 100%;
}
ul#my_malicious_lists  span.update_at:before {
content: 'Updated at ';
}
ul#my_malicious_lists span.record_title {
color: #00ac97;
width: fit-content;
font-weight: 900;
margin-bottom: 0px;
}
ul#my_malicious_lists span.record_author:before {
content: 'By ';
}
div#login-popup-overlay .popup-container {
max-height: 80vh;
}
div#login-popup-overlay span.text {
font-size: 12px;
} .page-announcement {
width: 100%;
font-size: 14px;
padding: 20px 0px;
border-top: 1px solid #d6d6d6;
font-family: 'Noto Sans TC', 'Noto Sans SC';
}
p.announcement-date {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
font-size: 15px;
color: #00ac97;
}
p.announcement-date:before {
content: '';
display: inline-block;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2300AC97"><path d="M11.62 3.38 7 8H4.5A2.5 2.5 0 0 0 2 10.5v3A2.5 2.5 0 0 0 4.5 16H7l4.62 4.62c.85.85 2.38.21 2.38-1.07V4.46c0-1.28-1.54-1.92-2.38-1.07ZM12 18.17l-3.88-3.88a1 1 0 0 0-.71-.29H4.5a.5.5 0 0 1-.5-.5v-3c0-.28.22-.5.5-.5h2.91c.27 0 .52-.11.71-.29L12 5.83v12.34ZM20.18 5.94a1 1 0 1 0-1.67 1.11 9 9 0 0 1 0 9.92c-.3.46-.18 1.08.28 1.39.46.3 1.08.18 1.39-.28a10.95 10.95 0 0 0 0-12.12ZM15.61 8.05a1 1 0 0 0-.34 1.37 4.96 4.96 0 0 1 0 5.15 1 1 0 0 0 .34 1.37 1 1 0 0 0 1.37-.34 7 7 0 0 0 0-7.22 1 1 0 0 0-1.37-.34Z"/></svg>');
background-repeat: no-repeat;
background-position: center;
width: 18px;
height: 18px;
}
span.special-text {
font-weight: 600;
color: #000;
}
.account-container {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: flex-end;
justify-content: space-between;
}
a.logout-url {
text-decoration: none;
border: 1px solid #00ac97;
border-radius: 10px;
width: fit-content;
display: block;
font-size: 14px;
font-weight: 400;
line-height: 1.5em;
color: #FFF;
background-color: #00ac97;
padding: 5px 20px 5px 20px;
}
form#login-form p.title {
text-align: center;
font-size: 24px;
}
form#login-form {
border: 0px;
background-color: transparent;
padding: 0;
}
div#report-popup-overlay .popup-container {
height: max-content;
max-height: fit-content;
}
form#report-record-form {
border: 0px;
background-color: transparent;
padding: 0;
}
form#report-record-form ul {
margin: 10px 0px;
list-style-type: none;
font-size: 15px;
color: #000;
}
form#report-record-form ul li {
color:#00ac97;
}
form#report-record-form ul li:before {
font-weight: 600;
color:#000;
}
li#report-record-id {
display: none;
}
li#report-record-author:before {
content: '作者：';
}
li#report-record-title:before {
content: '文章：';
}
.main-content_wrapper {
max-width: 800px;
width: 100%;
margin: auto;
padding: 20px;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
}
.main-content_wrapper h1.page-title {
text-align: center;
font-family: 'Noto Sans TC';
font-size: 28px;
font-weight: 700;
color: #404040;
}
.page-footer {
font-size: 12px;
color: #FFFFFF;
font-family: "Noto Sans TC", Sans-serif;
background-color: #14261C;
text-align: center;
padding: 5px;
}
div#update-alert {
background-color: #646464;
color: #ededed;
padding: 5px 10px;
border: 2px solid #393939;
border-radius: 5px;
position: fixed;
bottom: 10%;
left: 50%;
line-height: 1.5em;
transform: translateX(-50%);
font-size: 14px;
font-family: 'Noto Sans TC';
z-index: 1000;
display: none;
}
a#add-record-toggle {
margin: auto;
width: 100%;
display: block;
border: 1px solid #00ac97;
border-radius: 5px;
padding: 5px 10px;
font-size: 15px;
font-family: 'Noto Sans TC';
text-align: center;
background: #FFF;
color: #00ac97;
text-decoration: none;
}
a#add-record-toggle:hover {
background-color: #00ac97;
color: #FFF;
}
a#add-record-toggle:after {
content:'新增紀錄';
}
a#add-record-toggle.open:after {
content:'收起表單';
}
.record-form {
margin: 10px 0px;
padding: 15px;
border: 1px solid #d6d6d6;
font-size: 15px;
font-family: 'Noto Sans TC', 'Noto Sans SC';
border-radius: 8px;
gap: 10px;
display: flex;
background-color: #00ac970d;
flex-direction: column;
align-items: stretch;
justify-content: flex-start;
width: 100%;
}
.record-form .form-group {
display: flex;
flex-direction: column;
align-items: stretch;
}
.record-form .form-group ol {
margin: 1em;
font-size: 12px;
}
.record-form .form-group > label {
font-weight: 600;
color: #404040;
}
.record-form .form-group > input {
background: transparent;
padding: 10px;
border-width: 0px 0px 1px 0px;
border-radius: 0px;
border-color: #bdbfbe;
font-size: 15px;
color: #000000;
}
.record-form .form-group > textarea {
background: transparent;
border-color: #bdbfbe;
padding: 10px;
font-size: 15px;
color: #000000;
height: 170px;
}
.record-form .form-group p.input-notice,.record-form .form-group p.join-notice {
font-size: 12px;
color: #7d8b83;
margin-bottom: 0px;
line-height: 1.5em;
width: 100%;
}
.record-form .form-group button.btn {
padding: 10px;
font-size: 15px;
color: #FFF;
font-weight: 400;
background: #00ac97;
letter-spacing: 1px;
border-radius: 5px;
margin-top: 10px;
display: flex;
transition: .3s ease;
flex-direction: row;
align-items: center;
justify-content: center;
border: 0px;
gap: 5px;
}
.record-form .form-group button.btn.sending:after {
content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><radialGradient id="a5" cx=".66" fx=".66" cy=".3125" fy=".3125" gradientTransform="scale(1.5)"><stop offset="0" stop-color="%23FFFFFF"></stop><stop offset=".3" stop-color="%23FFFFFF" stop-opacity=".9"></stop><stop offset=".6" stop-color="%23FFFFFF" stop-opacity=".6"></stop><stop offset=".8" stop-color="%23FFFFFF" stop-opacity=".3"></stop><stop offset="1" stop-color="%23FFFFFF" stop-opacity="0"></stop></radialGradient><circle transform-origin="center" fill="none" stroke="url(/wp-content/themes/astra-child/%23a5)" stroke-width="10" stroke-linecap="round" stroke-dasharray="200 1000" stroke-dashoffset="0" cx="100" cy="100" r="70"><animateTransform type="rotate" attributeName="transform" calcMode="spline" dur="2" values="360;0" keyTimes="0;1" keySplines="0 0 1 1" repeatCount="indefinite"></animateTransform></circle><circle transform-origin="center" fill="none" opacity=".2" stroke="%23FFFFFF" stroke-width="10" stroke-linecap="round" cx="100" cy="100" r="70"></circle></svg>');
height: 20px;
width: 20px;
display: block;
}
div#records-table_wrapper {
font-size: 16px;
font-family: 'Noto Sans TC', 'Noto Sans SC';
margin-top: 20px;
border-top: 1px solid #d6d6d6;
padding-top: 20px;
}
div#records-table_wrapper input#dt-search-0 {
font-size: 15px;
border-width: 0px 0px 1px 0px;
border-radius: 0px;
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="%2300ac97" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg>');
background-repeat: no-repeat;
background-position: right;
background-size: 20px;
padding-right: 20px;
}
div#records-table_wrapper .dt-search > label {
display: none;
}
div#records-table_wrapper div#records-table_info {
color: #7d8b83;
font-weight: 400;
font-size: 12px;
}
div#records-table_wrapper button.dt-paging-button {
font-size: 14px;
color: #00ac97 !important;
padding: 5px 10px;
}
div#records-table_wrapper button.dt-paging-button.current {
color: #FFF !important;
background-color: #00ac97;
border: 1px solid #00ac97;
border-radius: 3px;
pointer-events: none;
transition: .3s ease;
}
div#records-table_wrapper.dt-container .dt-paging .dt-paging-button:hover {
background: #FFF !important;
border: 1px solid #00ac97;
border-radius: 3px;
}
.dt-paging-button.disabled {
pointer-events: none;
}
table#records-table {
border-width: 0px;
letter-spacing: 0.5px;
}
table#records-table thead {
}
table#records-table > thead > tr > th.dt-ordering-desc, table#records-table > thead > tr > th.dt-ordering-asc {
background: #00ac97;
color: #FFF;
}
table#records-table > thead > tr > th {
border: 1px solid #00ac97;
border-radius: 10px;
width: fit-content;
display: block;
font-size: 14px;
font-weight: 400;
line-height: 1.5em;
background: #FFF;
color: #00ac97;
padding: 5px 30px 5px 20px;
transition: .3s ease;
}
table#records-table > thead > tr > th:hover {
background: #00ac97;
color: #FFF;
}
table#records-table tr {
border-width: 0px !important;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: center;
gap: 10px
}
table#records-table td.hide-column {
display: none;
width: 0%;
}
table#records-table > tbody > tr > td {
font-size: 16px;
font-family: 'Noto Sans TC','Noto Sans SC';
border-radius: 8px;
border: 1px solid #d6d6d6;
padding: 10px;
margin: 10px 0px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-content: flex-start;
justify-content: flex-start;
align-items: center;
column-gap: 20px;
width: calc(100vw - 40px);
max-width: 760px;
}
.fic-management {
width: 100%;
display: flex;
justify-content: flex-end;
gap: 6px;
}
.fic-management .malicious-trigger {
padding: 3px 12px;
border-radius: 15px;
font-size: 12px;
color: #FFF;
background-color: #777777;
cursor: pointer;
box-shadow: inset 4px 2px 13px 3px rgba(0, 0, 0, 0.4);
position: relative;
overflow: hidden;
transition: all .3s ease;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
flex-wrap: nowrap;
}
.fic-management .malicious-trigger:hover {
background-color: #333333;
}
.fic-management .malicious-trigger .btnText:before {
order: 1;
}
.fic-management .malicious-trigger:before {
content: ' (' attr(data-numic) ')';
order: 2;
margin-left: 4px;
width: 23px;
height: 23px;
text-align: center;
transition: all .3s ease;
}
.fic-management .malicious-trigger.loading:before {
content: '';
background-image: url(/wp-content/themes/astra-child//assets/img/loader.svg);
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.fic-management .malicious-trigger.active:before {
margin-right: 24px;
}
.fic-management .malicious-trigger .check-box{
width: 28px;
height: 28px;
border-radius: 50%;
box-shadow: 0 0 12px -2px rgba(0,0,0,0.5);
position: absolute;
top: 0;
right: -28px;
opacity: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
transition: .3s;
}
.fic-management .malicious-trigger .check-box svg{
width: 20px;
}
.fic-management .malicious-trigger svg path{
stroke-width: 3;
stroke: #fff;
stroke-dasharray: 34;
stroke-dashoffset: 34;
stroke-linecap: round;
}
.fic-management .malicious-trigger.active{
background-color: #721c24;
box-shadow: inset 4px 2px 13px 3px rgba(0, 0, 0, 0.4);
}
.fic-management .malicious-trigger.active .check-box {
right: 0;
opacity: 1;
transition: .3s;
}
.fic-management .malicious-trigger span.btnText{
transition: .3s;
}
.fic-management .malicious-trigger svg path{
transition: .3s;
transition-delay: .3s;
}
.fic-management .malicious-trigger.active svg path{
stroke-dashoffset: 0;
}
.fic-management .malicious-trigger.loading {
cursor: progress;
pointer-events: none;
}
table#records-table p.fic-title, table#records-table p.fic-title > a {
color: #00ac97;
width: fit-content;
font-size: 16px;
font-weight: 900;
margin-bottom: 0px;
}
table#records-table p.fic-title > a {
text-decoration: underline;
}
table#records-table p.fic-author {
font-size: 13px;
margin-bottom: 0px;
}
table#records-table p.fic-author:before {
content: 'By ';
}
table#records-table p.fic-author.empty:before {
content: '';
}
p:not(.empty) span.copy-action {
content: '';
display: inline-flex;
width: 18px;
height: 18px;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23808285"><path d="M5.5 17H7v1.5A2.5 2.5 0 0 0 9.5 21h9a2.5 2.5 0 0 0 2.5-2.5v-9A2.5 2.5 0 0 0 18.5 7H17V5.5A2.5 2.5 0 0 0 14.5 3h-9A2.5 2.5 0 0 0 3 5.5v9A2.5 2.5 0 0 0 5.5 17Zm13-8c.28 0 .5.22.5.5v9a.5.5 0 0 1-.5.5h-9a.5.5 0 0 1-.5-.5v-9c0-.28.22-.5.5-.5h9ZM5 5.5c0-.28.22-.5.5-.5h9c.28 0 .5.22.5.5V7H9.5A2.5 2.5 0 0 0 7 9.5V15H5.5a.5.5 0 0 1-.5-.5v-9Z"/></svg>');
background-size: contain;
background-repeat: no-repeat;
opacity: .7;
cursor: pointer;
transform: translateY(.25em) translateX(5px);
}
table#records-table p.fic-note {
width: 100%;
background-color: #00ac970d;
padding: 10px;
border-radius: 5px;
color: #000;
margin: 10px 0px;
font-size: 15px;
word-break: break-word;
line-height: 1.9em;
}
table#records-table p.fic-admin-note ~ .fic-note,
table#records-table p.fic-clear-note ~ .fic-note {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
opacity: 0.5;
filter: blur(4px);
}
table#records-table p.fic-clear-note:before {
content: '';
width: 15px;
height: 13px;
display: inline-block;
background: url('data:image/svg+xml,<svg width="25" height="23" viewBox="0 0 25 23" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24.7186 19.4867C25.5198 20.8753 24.5142 22.6111 22.9141 22.6111H2.08569C0.482521 22.6111 -0.518434 20.8726 0.281132 19.4867L10.6955 1.42991C11.497 0.0406257 13.5045 0.043143 14.3046 1.42991L24.7186 19.4867ZM12.5 15.7535C11.3974 15.7535 10.5035 16.6474 10.5035 17.75C10.5035 18.8526 11.3974 19.7465 12.5 19.7465C13.6027 19.7465 14.4965 18.8526 14.4965 17.75C14.4965 16.6474 13.6027 15.7535 12.5 15.7535ZM10.6045 8.577L10.9264 14.4798C10.9415 14.756 11.1699 14.9722 11.4465 14.9722H13.5535C13.8301 14.9722 14.0585 14.756 14.0736 14.4798L14.3955 8.577C14.4118 8.27865 14.1743 8.02778 13.8755 8.02778H11.1245C10.8257 8.02778 10.5882 8.27865 10.6045 8.577Z" fill="%2300ac97"/></svg>');
background-repeat: no-repeat;
background-size: contain;
}
table#records-table p.fic-clear-note {
width: 100%;
font-size: 15px;
background-color: #00ac970d;
color: #00ac97;
padding: 5px;
line-height: 1.2em;
border: 2px solid #00ac97;
border-radius: 5px;
display: flow;
}
table#records-table p.fic-admin-note:before {
content: '';
width: 15px;
height: 13px;
display: inline-block;
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24"><path fill="%23FFF" stroke="%23721C24" stroke-width="2" stroke-linejoin="round" d="M15 3H8L4 14h6l-3 8 13-12h-7.5L15 3z"></path></svg>');
background-repeat: no-repeat;
background-size: contain;
}
table#records-table p.fic-admin-note {
width: 100%;
font-size: 15px;
background-color: #f8d7da;
color: #721c24;
padding: 5px;
line-height: 1.2em;
border: 2px solid #f5c6cb;
border-radius: 5px;
display: flow;
}
table#records-table p.fic-warning:before {
content: '';
width: 15px;
height: 13px;
display: inline-block;
background: url('data:image/svg+xml,<svg width="25" height="23" viewBox="0 0 25 23" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24.7186 19.4867C25.5198 20.8753 24.5142 22.6111 22.9141 22.6111H2.08569C0.482521 22.6111 -0.518434 20.8726 0.281132 19.4867L10.6955 1.42991C11.497 0.0406257 13.5045 0.043143 14.3046 1.42991L24.7186 19.4867ZM12.5 15.7535C11.3974 15.7535 10.5035 16.6474 10.5035 17.75C10.5035 18.8526 11.3974 19.7465 12.5 19.7465C13.6027 19.7465 14.4965 18.8526 14.4965 17.75C14.4965 16.6474 13.6027 15.7535 12.5 15.7535ZM10.6045 8.577L10.9264 14.4798C10.9415 14.756 11.1699 14.9722 11.4465 14.9722H13.5535C13.8301 14.9722 14.0585 14.756 14.0736 14.4798L14.3955 8.577C14.4118 8.27865 14.1743 8.02778 13.8755 8.02778H11.1245C10.8257 8.02778 10.5882 8.27865 10.6045 8.577Z" fill="%23E69829"/></svg>');
background-repeat: no-repeat;
background-size: contain;
}
table#records-table p.fic-warning {
width: 100%;
font-size: 15px;
background-color: #ffdda9;
color: #E69829;
padding: 5px;
line-height: 1.2em;
   border: 2px solid #edc894;
border-radius: 5px;
display: flow;
}
table#records-table p.fic-note:after { width: 100%;
display: block;
font-size: 10px;
font-weight: 300;
color: #00000033;
text-align: end;
}
table#records-table span.fic-date {
width: fit-content;
font-size: 12px;
color: #7d8b83;
flex-grow: 1;
display: flex;
flex-direction: column;
align-items: flex-start;
}
table#records-table .fic-action {
display: flex;
width: fit-content;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-end;
align-items: center;
}
.record-action:not(:first-child):before {
content: '';
display: block;
width: 1px;
height: 10px;
border-right: 1px solid;
margin: 0px 5px;
}
table#records-table a.fic-report-action {
width: fit-content;
font-size: 12px;
color: #7d8b83;
text-align: end;
display: flex;
flex-direction: row;
align-items: center;
gap: 2px;
cursor: pointer;
text-decoration: none;
}
table#records-table a.fic-report-action:after {
content: '';
display: inline-flex;
width: 13px;
height: 13px;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="%237d8b83" d="M441 58.9L453.1 71c9.4 9.4 9.4 24.6 0 33.9L424 134.1 377.9 88 407 58.9c9.4-9.4 24.6-9.4 33.9 0zM209.8 256.2L344 121.9 390.1 168 255.8 302.2c-2.9 2.9-6.5 5-10.4 6.1l-58.5 16.7 16.7-58.5c1.1-3.9 3.2-7.5 6.1-10.4zM373.1 25L175.8 222.2c-8.7 8.7-15 19.4-18.3 31.1l-28.6 100c-2.4 8.4-.1 17.4 6.1 23.6s15.2 8.5 23.6 6.1l100-28.6c11.8-3.4 22.5-9.7 31.1-18.3L487 138.9c28.1-28.1 28.1-73.7 0-101.8L474.9 25C446.8-3.1 401.2-3.1 373.1 25zM88 64C39.4 64 0 103.4 0 152L0 424c0 48.6 39.4 88 88 88l272 0c48.6 0 88-39.4 88-88l0-112c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 112c0 22.1-17.9 40-40 40L88 464c-22.1 0-40-17.9-40-40l0-272c0-22.1 17.9-40 40-40l112 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L88 64z"/></svg>');
background-size: contain;
background-repeat: no-repeat;
background-position-x: right;
}
table#records-table .fic-commtent-toggle:after {
content: '';
display: inline-flex;
width: 13px;
height: 13px;
border: 1px solid #7d8b83;
border-radius: 50%;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%237D8B83"><path d="M20 11h-7V4c0-.55-.45-1-1-1s-1 .45-1 1v7H4c-.55 0-1 .45-1 1s.45 1 1 1h7v7c0 .55.45 1 1 1s1-.45 1-1v-7h7c.55 0 1-.45 1-1s-.45-1-1-1Z"></path></svg>');
background-size: contain;
background-repeat: no-repeat;
background-position-x: right;
transition: .3s ease;
}
table#records-table .fic-commtent-toggle.open:after {
transform: rotate(45deg);
}
table#records-table .fic-commtent-toggle {
width: fit-content;
font-size: 12px;
color: #7d8b83;
text-align: end;
display: flex;
flex-direction: row;
align-items: center;
gap: 2px;
cursor: pointer;
}
table#records-table .fic-commtent {
display: none;
width: 100%;
}
table#records-table p.empty-notice {
margin-bottom: 0px;
font-size: 12px;
opacity: .5;
}
table#records-table p.empty-notice:after {
content:'目前無留言';
}
table#records-table .comments-list {
counter-reset: comment-floor;
margin: 10px 0px;
padding: 10px 0px;
border-top: 1px solid #0000000d;
border-bottom: 1px solid #0000000d;
}
table#records-table .comment-content {
counter-increment: comment-floor;
font-size: 14px;
font-weight: 400;
background-color: #00000005;
padding: 5px 10px;
margin: 5px 0px 5px 20px;
border-radius: 5px;
row-gap: 5px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
word-break: break-word;
justify-content: flex-start;
line-height: 1.5em;
}
table#records-table .comment-content:after {
content: counter(comment-floor) "F | " attr(data-date);
font-size: 8px;
font-weight: 300;
color: #00000054;
width: 100%;
text-align: end;
display: block;
}
table#records-table .action {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
column-gap: 10px;
row-gap: 5px;
}
table#records-table .action:after {
content: attr(data-notice);
font-size: 10px;
color: #7d8b83;
margin-bottom: 0px;
line-height: 1em;
width: 100%;
}
table#records-table input.add-comment {
height: 2em;
border: 1px solid #7d8b83;
border-radius: 5px;
width: 60%;
flex-grow: 1;
font-size: 15px;
outline-color: #7d8b83;
}
table#records-table button.add-comment-action {
padding: 5px;
font-size: 15px;
line-height: 1em;
height: 2em;
color: #FFF;
font-weight: 400;
background: #00ac97;
letter-spacing: 1px;
border-radius: 5px;
width: 60px;
transition: .3s ease;
}
table#records-table  button.add-comment-action:hover {
background: #FFF;
color: #00ac97;
}
table#records-table .action.close {
pointer-events: none;
opacity: 0;
display: none;
}
table#records-table a.content-link {
color: #00ac97;
text-decoration: underline;
font-size: 0.8em;
}
.jump-page-container {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
margin-bottom: 10px;
}
.jump-page--wrapper {
border: 1px solid #00ac97;
border-radius: 5px;
width: fit-content;
display: flex;
font-size: 14px;
font-weight: 400;
line-height: 1.5em;
background: #00ac97;
color: #FFF;
padding: 0px;
transition: .3s ease;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: space-between;
overflow: hidden;
font-family: sans-serif;
letter-spacing: .5px;
}
span.jump-page-title {
color: #7d8b83;
font-weight: 400;
font-size: 12px;
text-align: center;
}
input#jump-to-page--top,
input#jump-to-page--bottom{
border-width: 0px;
border-radius: 0px;
padding: 8px 5px;
width: 36px;
font-size: 14px;
font-weight: 400;
line-height: 1.5em;
text-align: center;
background-color: #FFF;
font-family: sans-serif;
letter-spacing: .5px;
}
div.total-page {
width: 36px;
text-align: center;
}
div#scroll-to-bottom-btn {
position: fixed;
bottom: 20px;
right: 20px;
width: 40px;
height: 40px;
background-color: #edfffd0d;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2300AC97"><path d="M21.06 7.94a1.49 1.49 0 0 0-2.12 0L12 14.88 5.06 7.94c-.59-.59-1.54-.59-2.12 0s-.59 1.54 0 2.12l8 8c.29.29.68.44 1.06.44s.77-.15 1.06-.44l8-8c.59-.59.59-1.54 0-2.12Z"></path></svg>');
background-size: 50%;
background-repeat: no-repeat;
background-position: center;
color: #fff;
text-align: center;
line-height: 50px;
font-size: 24px;
font-weight: bold;
border-radius: 50%;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
cursor: pointer;
z-index: 99;
opacity: .9;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
transition: all 0.3s ease;
}
div#scroll-to-bottom-btn:hover {
opacity: 1;
}
div#login-action {
position: fixed;
bottom: 70px;
right: 20px;
width: 40px;
height: 40px;
background-color: #edfffd0d;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="%2300AC97" d="M240 192C240 147.8 275.8 112 320 112C364.2 112 400 147.8 400 192C400 236.2 364.2 272 320 272C275.8 272 240 236.2 240 192zM448 192C448 121.3 390.7 64 320 64C249.3 64 192 121.3 192 192C192 262.7 249.3 320 320 320C390.7 320 448 262.7 448 192zM144 544C144 473.3 201.3 416 272 416L368 416C438.7 416 496 473.3 496 544L496 552C496 565.3 506.7 576 520 576C533.3 576 544 565.3 544 552L544 544C544 446.8 465.2 368 368 368L272 368C174.8 368 96 446.8 96 544L96 552C96 565.3 106.7 576 120 576C133.3 576 144 565.3 144 552L144 544z"/></svg>');
background-size: 50%;
background-repeat: no-repeat;
background-position: center;
color: #fff;
text-align: center;
line-height: 50px;
font-size: 24px;
font-weight: bold;
border-radius: 50%;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
cursor: pointer;
z-index: 99;
opacity: .9;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
transition: all 0.3s ease;
}
div#login-action.login {
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="%2300AC97" d="M104 112C90.7 112 80 122.7 80 136L80 184C80 197.3 90.7 208 104 208L152 208C165.3 208 176 197.3 176 184L176 136C176 122.7 165.3 112 152 112L104 112zM256 128C238.3 128 224 142.3 224 160C224 177.7 238.3 192 256 192L544 192C561.7 192 576 177.7 576 160C576 142.3 561.7 128 544 128L256 128zM256 288C238.3 288 224 302.3 224 320C224 337.7 238.3 352 256 352L544 352C561.7 352 576 337.7 576 320C576 302.3 561.7 288 544 288L256 288zM256 448C238.3 448 224 462.3 224 480C224 497.7 238.3 512 256 512L544 512C561.7 512 576 497.7 576 480C576 462.3 561.7 448 544 448L256 448zM80 296L80 344C80 357.3 90.7 368 104 368L152 368C165.3 368 176 357.3 176 344L176 296C176 282.7 165.3 272 152 272L104 272C90.7 272 80 282.7 80 296zM104 432C90.7 432 80 442.7 80 456L80 504C80 517.3 90.7 528 104 528L152 528C165.3 528 176 517.3 176 504L176 456C176 442.7 165.3 432 152 432L104 432z"/></svg>');
}
.footer-actions {
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: nowrap;
justify-content: center;
}
.footer-action:not(:first-child):before {
content: '';
display: block;
width: 1px;
height: 10px;
border-right: 1px solid;
margin: 0px 8px;
}
.footer-action {
display: flex;
align-items: center;
flex-direction: row;
flex-wrap: nowrap;
}
a#update-notice {
font-family: "Noto Sans TC", Sans-serif;
font-size: 12px;
color: #7d8b83;
font-weight: 300;
text-decoration: underline;
text-underline-offset: 2px;
}
a#update-notice:before {
content: '更新: ver ';
}
a#report-page {
font-family: "Noto Sans TC", Sans-serif;
font-size: 12px;
color: #7d8b83;
font-weight: 300;
text-decoration: underline;
text-underline-offset: 2px;
} a.back-action:before {
width: 20px;
height: 20px;
content: '';
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%2300AC97"><path d="m22.66 10.25-8-7A1 1 0 0 0 13 4v3.03C3.56 7.54 1 15.33 1 20c0 1.05 1.42 1.39 1.89.45.67-1.34 3.92-5.05 10.11-5.42V18a1 1 0 0 0 1.66.75l8-7c.45-.4.45-1.11 0-1.51ZM15 15.8V14a1 1 0 0 0-1-1c-4.7 0-8.28 1.74-10.53 3.68C4.34 13.42 6.85 9 14 9a1 1 0 0 0 1-1V6.2l5.48 4.8L15 15.8Z"/></svg>');
background-repeat: no-repeat;
display: block;
transform: scaleX(-1);
}
a.back-action {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
gap: 5px;
}
table#reports-table {
font-size: 14px;
}
table#reports-table th {
padding: 5px ;
}
table#reports-table td {
padding: 5px ;
}
table#reports-table tr.processed {
opacity: 0.8;
background-color: #a9a9a9;
}
table#reports-table p.fic-title {
font-weight: 300;
font-size: 10px;
}
table#reports-table tr.pending td.report-status-column {
color: #575d59;
font-weight: 900;
}
table#reports-table tr.processed td.report-status-column {
color: #095722;
font-weight: 900;
}
table#reports-table td.id-column {
width: 13%;
min-width: 48px;
}
table#reports-table td.admin-response-column {
color: #000;
}
table#reports-table td.report-status-column {
width: 3.5em;
}
table#reports-table td.fic-data-column {
width: 50%;
}
table#reports-table p.report-reason {
width: 100%;
background-color: #00ac970d;
padding: 5px;
border-radius: 5px;
font-size: 12px;
word-break: break-word;
line-height: 1.5em;
}
@media screen and (min-width: 768px) {
table#records-table tr {
justify-content: flex-start;
}
}