:root
{
--color-xam:#CCC;
--color-red:rgb(214, 0, 0);
}
.dp_color_primary{color: var(--primary-color);}
.dp_bg_none {background: none; color: unset;}
.dp_color_red, .dp_bg_none .dp_color_red{color: var(--color-red);}
.dp_box{border: 1px solid var(--color-xam);}
.dp_border_bottom {border-bottom: 1px solid var(--color-xam);}
.dp_border_top {border-top: 1px solid var(--color-xam);}
.dp_border_left{border-left: 1px solid var(--color-xam);}
.dp_border_right{border-right: 1px solid var(--color-xam);}
.dp_p1{padding: 5px;} .dp_p2{padding: 10px;} .dp_p3{padding: 15px;} .dp_p4{padding: 20px;}
.dp_pl1{padding-left:5px;} .dp_pl2{padding-left:10px;} .dp_pl3{padding-left:15px;} .dp_pl4{padding-left:20px;}
.dp_pr1{padding-right:5px;}.dp_pr2{padding-right:10px;}.dp_pr3{padding-right:15px;}.dp_pr4{padding-right:20px;}
.dp_pt1{padding-top: 5px;} .dp_pt2{padding-top: 10px;} .dp_pt3{padding-top: 15px;} .dp_pt4{padding-top: 20px;}
.dp_pb1{padding-bottom: 5px;} .dp_pb2{padding-bottom: 10px;} .dp_pb3{padding-bottom: 15px;} .dp_pb4{padding-bottom: 20px;}
.dp_px2{padding-left: 10px; padding-right: 10px;}
.dp_px3{padding-left: 15px; padding-right: 15px;}
.dp_px4{padding-left: 20px; padding-right: 20px;}
.dp_py2{padding-top: 10px; padding-bottom: 10px;}
.dp_py4{padding-top: 20px; padding-bottom: 20px;}
.dp_my1{margin-top: 5px; margin-bottom: 5px;} .dp_my2{margin-top: 10px; margin-bottom: 10px;}
.dp_my3{margin-top:15px; margin-bottom:15px;} .dp_my4{margin-top: 20px; margin-bottom: 20px;}
.dp_mx1{margin-left: 5px; margin-right: 5px;} .dp_mx2{margin-left: 10px; margin-right: 10px;}
.dp_mx3{margin-left:15px; margin-right:15px;} .dp_mx4{margin-left: 20px; margin-right: 20px;}
.dp_ml1{margin-left: 5px;} .dp_ml2{margin-left: 10px;}
.dp_ml3{margin-left:15px;} .dp_ml4{margin-left: 20px;}
.dp_mr1{margin-right: 5px;} .dp_mr2{margin-right: 10px;}
.dp_mr3{margin-right:15px;} .dp_mr4{margin-right: 20px;}
.dp_txt_b{font-weight: bold;}
.dp_txt_i{font-style: italic;}
.dp_txt_u{text-decoration: underline;}
.dp_pointer{cursor: pointer;}
.dp_hover:hover{transition: transform 0.2s ease; transform: scaleY(1.05); background: #e2e2e2f1 !important;}
.dp-is-loading i {display: inline-block;animation: dp-spin 1s infinite linear; transition: transform 0.2s ease; transform: scaleY(2);} .dp-is-loading {opacity: 0.7; cursor: not-allowed !important;pointer-events: none; }
.dp_member_button, .dp_comment_count {border: 2px solid var(--primary-color); display: inline-block; box-shadow: 4px 4px #19536a33;}
.dp_member_button .icon_box, .dp_comment_count .icon_box {display: inline-block; font-size: 120%;}
.dp_member_button:hover, .dp_comment_count:hover{box-shadow:6px 6px #19536a33}
.dp_comments .member_box{margin-bottom: 5px; display: flex; gap: 15px}
.dp_comments .member {font-weight: bold;}
.dp_comments .comment-date{font-style: italic; color: #888;}
.dp_comments .comment-item{border-left: 1px solid #CCC;padding-left: 10px; margin-bottom: 15px;border-top-left-radius: 6px;border-bottom-left-radius: 6px;} @keyframes dp-spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}