.akmask{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background:rgba(0, 0, 0, 0.5);
    z-index: 100;
    display:none;
}
.akfloat{
    position: absolute;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 480px;
    width: 90%;
    z-index: 200;
    background: #fff;
    box-shadow: 0 0 #0000, 0 0 #0000,
                0 20px 25px -5px rgb(0 0 0 / .1),
                0 8px 10px -6px rgb(0 0 0 / .1);
    padding: 2rem;
    border-radius: 1.5rem;
    border: 1px solid #e5e7eb;
    text-align: center;
    text-align: left;
    display:none;
}
.akgroup_page{
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 0;
}
.text-center{
    text-align: center;
}
.imp_messages,.err_msg{
    width: 100%;
    padding: 12px;
    background-color: rgb(255 251 235);
    border: 1px solid rgb(253 230 138);
    border-radius: 10px;
    font-size: 12px;
}
.err_msg{
  background-color:#FEF2F2;
  border: 1px solid rgb(254 202 202);
  color:rgb(185 28 28);
  font-size: 0.85rem;
}
.perc_result_msg .imp_messages{
  color:rgb(180 83 9);
  font-size: 0.85rem;
}
.input_cont {
    width: 100%;
    padding-bottom:15px;
    position: relative;
}
.input_cont input,.input_cont select{
    background-color: #ffffff;
    border-radius: 10px 10px 10px 10px;
    color: #4B5563;
    font-size: 16px;
    min-height: 47px;
    padding: 6px 16px;
    border: 1px solid #D1D5DB;
    transition: all .3s;
}
.input_cont input:focus,.input_cont select:focus{
    border: 1px solid #69727d !important;
}
.input_cont input[type=checkbox]{
  vertical-align: bottom;
  min-height: 0;
}
.input_cont label{
    padding-bottom: 10px;
    color: rgb(55 65 81);
    font-weight: 500;
    font-size: 0.85rem;
}
.input_cont p{
    font-size: 12px;
    margin: 0;
}
.input_cont .curr_sign{
    position: absolute;
    left: 14px;
    font-size: 1.1rem;
    top: 36px;
    color: rgb(156 163 175);
}
.input_cont input[name="amt"]{
padding-left: 28px;
}
.pwd_error{
    background: #FEF2F2;
    border: 1px solid rgb(254 202 202);
    border-radius: 10px;
    padding: 9px 12px;
    font-size: 0.9rem;
    color: rgb(220 38 38);
    display:none;
}
.submit_cont {
    display: flex;
    padding-top: 12px;
    width: 100%;
    flex-direction: row;
    gap:15px;
}
.akbutton,.akrecent_groups .r_row .r_box .aklnkbutton{
    background-color: transparent;
    background-image: linear-gradient(90deg, #2564EA 0%, #0D9389 100%);
    color: #fff;
    border-radius: 15px;
    padding: 12px 22px;
    transition: all .3s;
}
.akbutton:hover,.akrecent_groups .r_row .r_box .aklnkbutton:hover {
    box-shadow: 0px 6px 14px 0px rgba(0,0,0,0.5);
}
.akbutton:disabled{
    opacity: 0.5;
    cursor:no-drop;
}
.submit_cont .akbutton{
    flex-grow: 1;
}
.submit_cont .akcancel{
    color: #000;
    text-decoration: none;
    padding: 12px 20px;
    border-radius: 15px;
    cursor:pointer;
}
.submit_cont .akcancel:hover{
    background: #F3F4F6;
}
.akgroup_page .shbox{
    border: 1px solid #e5e7eb;
    box-shadow: 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
    background: #fff;
    padding: 2rem;
    border-radius: 1.5rem;
}
.flex-box{
    display:flex;
    flex-direction: row;
    gap:30px;
}
.title_box{
    flex-grow: 1;
    font-size: 0.9rem;
    margin-top: -15px;
}
.share_box_cont{
    margin-bottom: auto;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.title_box .calcs,.share_box_cont .calcs{
    font-weight: 600;
    padding: 5px 0;
    font-size: 0.9rem;
    text-align:center;
}
.imp_msg_bold{
    color: rgb(220 38 38);
    font-weight: 500;
}
.gtitle{
margin-bottom:10px;
display: flex;
align-items: center;
font-size: 1.6rem;
gap: 10px;
}
.imp_msg{
    color: rgb(220 38 38);
    font-size: 14px;
}
/* .share_box{
    display: flex;
    flex-direction: row;
    gap: 10px;
}
.share_box a{
    background: rgb(243 244 246);
    display: inline-block;
    height: 36px;
    padding: 7px 15px;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.4rem;
    text-decoration: none;
    font-weight: 500;
    color: #000;
} */
 .share_box {
    display: flex;
    flex-direction: row;
    gap: 10px;
}

.share_box a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgb(243 244 246);
    padding:7px 15px;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.4rem;
    text-decoration: none;
    font-weight: 500;
    color: #000;
    white-space: nowrap;
    margin-bottom: auto;
    margin-top: auto;
}
.share_box a:hover{
    background-color:#E5E7EB;
}
.share_box a.share_url{
    background-color: rgb(219 234 254);
}
.share_box a.share_url:hover{
    background-color:#BFDBFE;
}
.share_box a.clear_all{
    background-color:rgb(254 226 226);
}
.share_box a.clear_all:hover{
    background-color:#FECACA;
}
.share_box a.share_email{
  background-color:rgb(220 252 231);
}
.share_box a.share_email:hover{
    background-color:rgb(187 247 208);
}
.forms_box_cont{
    padding-top: 30px;
    display: flex;
    flex-direction: row;
    width: 100%;
    gap:20px;
}
.forms_box_cont .shbox{
    flex-grow: 1;
    width:100%;
}
.forms_box_cont .inner_bill_cont{
    flex-grow: 1;
    width:50%;
    margin-bottom: auto;
}
.forms_box_cont .inner_bill_cont .shbox.participants{
    margin-bottom: 30px;
}
.input_cont.flex-b{
    display: flex;
    flex-direction: row;
    gap: 12px;
}
.member_cont{
    padding:20px 0;
}
.close_but{
position: absolute;
right: 15px;
top: 15px;
cursor: pointer;
}
.akfloat > .close_but{
color: rgb(156 163 175) !important;
}
.akfloat > .close_but:hover{
  color: rgb(75 85 99) !important;
}
.member_cont .mem{
    padding:12px 15px;
    border-radius: 10px;
    position: relative;
    margin-bottom: 8px;
    font-weight: 500;
    background-color: rgb(249 250 251);
}
.member_cont .mem:hover{
    background-color: rgb(243 244 246);
}
.member_cont .mem .del_mem{
    position: absolute;
    right: 15px;
    color: #555;
    display: none;
}
.member_cont .mem:hover .del_mem{
    display:inline-block;
}
.member_cont .mem .del_mem:hover{
color: #f00;
}
.member_cont .mem .perc_box{
  position: absolute;
  right: 45px;
  top: 6px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
}
.member_cont .mem .perc_box svg{
  color: rgb(156 163 175);
}
.member_cont .mem .perc_box input{
  max-width:90px;
  border: 1px solid rgb(209 213 219);
  padding: 5px 10px;
  border-radius: 5px;
}
.perc_result_cont{
  display:none;
  padding-bottom: 20px;
}
.perc_result{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  font-weight: 500;
  font-size: 0.9rem;
}
.perc_result .pttl{

}
.perc_result_msg{
  padding-top: 10px;
}
.split_box_label {
    display: flex;
    flex-direction: row;
    gap: 30px;
    padding-top: 10px;
    font-size: 0.9rem;
    font-weight: 500;
}
.split_box_label label{
    color: rgb(55 65 81);
    font-weight: 500;
    font-size: 0.85rem;
    display: flex;
    gap: 5px;
    align-items: center;
}
.split_box_label .split_right{
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-left: auto;
}
.split_box_label .split_right .select_all{
    color: rgb(29 78 216);cursor: pointer;
}
.split_box_label .split_right .clear_all{
    color: rgb(75 85 99);cursor: pointer;
}
#add_bill{float: right;}
.split_box, .items_cont .itm .inp_mems .itm_split_box{
    display: grid;
    background: #F9FAFB;
    margin: 10px 0;
    padding: 18px;
    border-radius: 15px;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow-y: auto;
    max-height: 8rem;
}
.split_box label, .items_cont .itm .inp_mems .itm_split_box label{
    padding: 10px;
    border-radius: 7px;
    font-size: 0.95rem;
    display: flex;
    gap: 7px;
}
.split_box label:hover,.items_cont .itm .inp_mems .itm_split_box label:hover{
    background-color: #F3F4F6;
}
.split_box label.extra-member{
    color: #f00;
}
.bills_cont{
    padding-top: 3px;
}
.bills_cont .sbill{
    position: relative;
    margin-top:15px;
    border: 1px solid rgb(229 231 235);
    border-radius: 12px;
    padding: 15px;
    transition: all .3s;
    font-size: 0.9rem;
}
.bills_cont .sbill:hover{
    box-shadow: 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
}
.bills_cont .sbill .edit_bill,.bills_cont .sbill .del_bill{
    position: absolute;
    right: 15px;
    display: none;
}
.bills_cont .sbill .edit_bill{
    right: 38px;
}
.bills_cont .sbill:hover .edit_bill,.bills_cont .sbill:hover .del_bill{
display: inline-block;
}
.bills_cont .sbill span.currr{
    position: absolute;
    right: 70px;
    text-align: right;
    color: rgb(22 163 74);
    font-size: 1.2rem;
    font-weight: bold;
}
.bills_cont .sbill h3{
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: rgb(31 41 55);
    margin-bottom: 5px;
}
.bills_cont .sbill .bill_info{
    padding-top: 5px;
    font-size: 0.85rem;
    color: rgb(75 85 99);
}
.bills_cont .sbill .bill_info p{
    margin:0 0 3px 0;
}
.bills_cont .sbill .bill_info p.date{
    font-size: 0.75rem;
}
.bills_cont .sbill .bill_info p b{
    font-weight: 600;
}
.bills_cont .sbill .bill_info p.perc_spt{
  padding-left: 15px;
}
.bills_cont .sbill .bill_info .itm_spt{
padding-left: 10px;
font-size: 0.8rem;
}
.bills_cont .sbill .bill_info p.spt_itm{
  color: rgb(29 78 216);
  font-weight: 600;
}
.bills_cont .sbill .bill_info .itm_spt b{
  font-weight: 600;
}
.shbox.bills .bills_cont .oldb{
  display: none;
}
.shbox.bills .bills_cont .show_old_bill{
  cursor: pointer;
  width: 100%;
  display: block;
  text-align: center;
  color: #fff;
  margin-bottom: 20px;
}
.shbox.bills .bills_cont .oldb.settd{
  padding: 20px 0;
  text-align: center;
  position: relative;
}
.shbox.bills .bills_cont .oldb.settd::after{
  content: " ";
  position: absolute;
  background-color: transparent;
  background-image: linear-gradient(90deg, rgb(22 163 74) 0%, rgb(134 239 172) 100%);
  height: 1px;
  width: 100%;
  left: 0;
  top: 45px;
  z-index: 1;
}
.shbox.bills .bills_cont .oldb.settd .sinn{
  background: #F0FDF4;
  color: rgb(22 163 74);
  border: 2px solid rgb(134 239 172);
  padding: 15px;
  border-radius: 10px;
  width: auto;
  display: inline-block;
  position: relative;
    z-index: 2;
}
.settlements_box .sett_periods{
  display: none;
  flex-direction: row;
  gap: 10px;
}
.settlements_box .sett_periods .current,.settlements_box .sett_periods .sperr,.perc_result .reset_perc{
  background: rgb(243 244 246);
  padding: 7px 20px;
  color: #000;
  border-radius: 10px;
  cursor: pointer;
}
.settlements_box .sett_periods .current:hover,.settlements_box .sett_periods .sperr:hover,.perc_result .reset_perc:hover{
  background:rgb(229 231 235);
}

.settlements_box .sett_periods .sperr.active{
  background:#22C55E;
  color:#fff !important;
}
.settlements_box .sett_periods .sperr.active:hover{
  background:rgb(22 163 74);
}

.settlements_box .sett_periods .current.active{
  background:#3B82F6;
  color: #fff !important;
}
.settlements_box .sett_periods .current.active:hover{

}

.forms_box_cont.settlements h2 {
  margin:0;
  padding-bottom:10px;
}

.transactions_cont {
  display: flex;
  flex-direction: column;
  gap: 14px; /* cleaner spacing instead of margin-bottom */
  padding: 5px;
  margin-top: -5px;
}

.balances_cont .balance-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 15px;
  margin-bottom: 12px;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

.transactions_cont .tran-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding:7px 8px 8px 15px;
  border-radius: 12px;
  background: linear-gradient(135deg, #f5f9ff, #e9f1fb);
  border: 1px solid #c9daf3;
  color: #0f3e72;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.transactions_cont .tran-row .party-info{
display: flex;
}
.transactions_cont .tran-row .amt-info{
display: flex;
}

.balance-row.receive {
    background: #F0FDF4;
    color: rgb(22 163 74);
    border: 1px solid rgb(187 247 208);
}

.balance-row.owe {
    color: rgb(220 38 38);
    border: 1px solid rgb(254 202 202);
    background: #FEF2F2;
}

/* .transactions_cont .tran-row:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
} */

/* Green Transaction (paid) */
.tran-row.green-tran {
  background: linear-gradient(135deg, #f0fff5, #e6f9ec) !important;
  border-color: #b4e2c2;
  color: #1e7d34;
}

/* Blue Transaction (default) */
.tran-row.blue-tran {
  background: linear-gradient(135deg, #f2f8ff, #e8f1fb) !important;
  border-color: #b8d2f0;
  color:rgb(37,99,235);
}

/* Parties */
.tran-row .party {
    color: #333;
    font-weight: 600;
}

/* Arrow between parties */
.transaction-arrow {
  margin: 0 14px;
  font-size: 18px;
  color:#0d6efd;
  display: flex;
  align-items: center;
  opacity: 0.8;
}
.tran-row.green-tran .transaction-arrow{
color: #1e7d34;
}

/* Amount */
.tran-row .amount {
  font-weight:600;
  font-size: 1rem;
  color:inherit;
  margin:5px 20px;
}
.shbox.bills .total_amt{
    text-align: center;
    padding-top: 15px;
    font-weight: bold;
    font-size: 1.2rem;
    border-top: 1px solid rgb(229 231 235);
    margin-top: 25px;
    color: rgb(55 65 81);
}

/* Mark Button */
.btn-mark {
  display: flex;
  align-items: center;
  gap: 6px;
  background: #0d6efd;
  border: none;
  color: #fff;
  padding: 8px 14px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.25s ease, transform 0.1s ease;
  font-size: 14px;
  font-weight: 500;
  box-shadow: 0 2px 6px rgba(13, 110, 253, 0.3);
}

.btn-mark svg {
  width: 14px;
  height: 14px;
}

.btn-mark:hover {
  background: #0b5ed7;
  transform: translateY(-1px);
}

.btn-mark:active {
  transform: scale(0.97);
}

/* Paid Button Style */
.btn-mark.paid {
  background: #198754 !important;
  box-shadow: 0 2px 6px rgba(25, 135, 84, 0.3);
}
.settlements_box{
    border: 1px solid #e5e7eb;
    box-shadow: 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
    background: #fff;
    margin-top: 40px;
    border-radius: 1.5rem;
    padding: 2rem;
}
.settlements_box .stitle{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.settlements_box .stitle .sbuttons{
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-bottom: auto;
}
.settlements_box .stitle .sbuttons button{
    background-color: rgb(219 234 254);
    color: #000;
    border: 0;
    border-radius: 7px;
    padding:10px 15px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    font-weight: 400;
    line-height: 1;
    font-size: 0.9rem;
    font-weight: 500;
}
.settlements_box .stitle .sbuttons button:hover{
    background-color:#BFDBFE;
}
.settlements_box .stitle .sbuttons button.export{
background-color:rgb(243 244 246);
}
.settlements_box .stitle .sbuttons button.export:hover{
    background-color:rgb(229 231 235);
}
.settlements_box .audit_cont{
    background: #EFF6FF;
    border: 1px solid rgb(191 219 254);
    border-radius: 10px;
    padding: 9px 15px 13px 15px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #333;
    flex-direction: column;
    margin-bottom: 20px;
    margin-top: 15px;
    display: none;
}
.settlements_box .audit_cont.shownow{
    display: flex;
}
.settlements_box .audit_cont h3{
    color: rgb(30 64 175);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 7px;
    font-size: 1rem;
    margin-bottom: 18px;
}
.settlements_box .audit_cont .au_inner{
    display: flex;
    flex-direction: column;
    gap: 7px;
}
.settlements_box .audit_cont .au_inner .au_row{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.settlements_box .audit_cont .au_inner .au_row .val{
    font-weight: 700;
}
.settlements_box .audit_cont .au_tip{
    border-top: 1px solid rgb(191 219 254);
    margin-top: 5px;
    padding-top: 7px;
    color: rgb(29 78 216);
    font-weight: 400;
}
.settlements_box .export_cont{
    background: #F9FAFB;
    border: 0;
    border-radius: 10px;
    padding: 15px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #333;
    flex-direction: column;
    margin-bottom: 20px;
    margin-top: 15px;
    display: none;
}
.settlements_box .export_cont.shownow{
    display: flex;
}
.settlements_box .export_cont .extitle{
    display: flex;
    flex-direction: row;
    gap: 7px;
    justify-content: space-between;
    padding-bottom:3px;
}
.settlements_box .extitle h3{
    font-size: 1rem;
}
.settlements_box .export_cont .extitle .excopy{
    color: #fff;
    font-size: 0.9rem;
    display: flex;
    flex-direction: row;
    margin-bottom: auto;
    align-items: center;
    gap: 7px;
    background-color: rgb(59 130 246);
    border: 0;
    border-radius: 10px;
    padding: 6px 15px;
}
.settlements_box .export_cont .extitle .excopy:hover{
    background-color: rgb(37 99 235);
}
.settlements_box .export_cont textarea{
    border: 1px solid rgb(209 213 219);
    border-radius: 10px;
    font-size: 0.86rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
}
.forms_box_cont.settlements{
    padding-top: 0;
}
.balances_cont .person{
    color:#333;
    font-weight: 600;
}
.balances_cont .amt_box{
    display: flex;
    flex-direction: column;
    text-align: right;
}
.balances_cont .amount{
    font-weight: 600;
}
.balances_cont .status{
    color: #555;
    font-size: 0.8rem;
    font-weight: 500;
}
.forms_box_cont.settlements .shbox{
    border:0;box-shadow:none;padding: 0;
}
.akrecent_groups{
    border: 1px solid #e5e7eb;
    box-shadow: 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
    background: #fff;
    padding: 2rem;
    border-radius: 1.5rem;
    font-size: 0.9rem;
    max-width: 1200px;
    margin: 0 auto;
}
.akrecent_groups .r_tip{
    border: 1px solid rgb(191 219 254);
    background: rgb(239 246 255);
    color: rgb(30 64 175);
    font-size: 0.9rem;
    padding: 10px;
    border-radius: 12px;
}
.akrecent_groups .r_list{
    padding-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
}
.akrecent_groups .r_row{
    background: #FBFBFC;
    border: 1px solid rgb(229 231 235);
    padding: 15px;
    border-radius: 12px;
    display: flex;
    flex-direction: row;
    gap: 30px;
    text-align: justify;
}
.akrecent_groups .r_row:hover{
transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
}
.akrecent_groups .r_row .l_box{
flex-grow: 1;
}
.akrecent_groups .r_row .l_box h3{
    margin: 0;
    padding-bottom: 10px;
    font-size: 1.2rem;
}
.akrecent_groups .r_row .r_box{

}
.akrecent_groups .r_row .r_box .copy{
    color: rgb(29 78 216);
    border: 0;
    margin-right: 10px;
    border-radius: 9px;
    font-size: 0.9rem;
    font-weight: 500;
    padding: 10px 15px;
}
.akrecent_groups .r_row .r_box .copy:hover,.akrecent_groups .r_row .r_box .copy:focus{
    background: #EFF6FF;
}
.akrecent_groups .r_row .r_box .aklnkbutton{
        padding: 10px 15px;
    text-decoration: none;
    border-radius: 6px;
}
.akrecent_groups .r_row .l_box .i_box{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.akrecent_groups .r_row .l_box .i_box span{
    text-align: left;
}
.akrecent_groups .r_row .l_box .i_box svg{
    width: 14px;
    height: 14px;
}
.new-gr-cont{
    text-align: center;
    width: 100%;
}
.new-gr-cont .new-gr-button{
    font-family: "Roboto";
    font-size: 18px;
    background-color: transparent;
    background-image: linear-gradient(90deg, #2564EA 0%, #0D9389 100%);
    border-radius: 15px 15px 15px 15px;
    font-weight: 500;
    color: #fff;
    box-shadow: none;
    text-decoration: none;
    display: inline-block;
    padding: 12px 24px;
    fill: #fff;
    text-align: center;
    transition: all .3s;
}
.new-gr-cont .new-gr-button:hover{
    transform: scale(1.03);
}
.new-gr-cont .new-gr-button span{
    display: flex;
    align-items: center;
    gap: 10px;
}
.new-gr-cont .new-gr-button span svg{
    width: 18px;
    height: 18px;
}
.settlements_box .work_tip{
    background: #EFF6FF;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 10px 15px;
    color: rgb(29 78 216);
    margin-top: 20px;
    font-size: 0.86rem;
}
.settlements_box .work_tip h4{
    font-size: 1rem;
    margin-bottom:8px;
}
.settlements_box .work_tip p{
    margin-bottom: 5px;
}
.paypal_tip{
    margin-top: 20px;
    font-size: 0.87rem;
    text-align: center;
    background-image: linear-gradient(to right, #eff6ff, #f0fdfa);
    padding: 8px 10px;
    border: 1px solid rgb(191 219 254);
    border-radius: 12px;
}
.paypal_tip h4{
    font-size: 1rem;
    margin-bottom: 10px;
}
.paypal_tip .p_tip{
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
    gap: 20px;
    justify-content: center;
}
.paypal_tip .p_tip span{
font-size: 1.125rem;
line-height: 1.75rem;
color:rgb(37 99 235);
font-weight:600;
}
.paypal_tip .p_tip a{
    font-size: .875rem;
    line-height: 1.25rem;
    padding: 0.5rem 1rem;
    background-color: rgb(37 99 235);
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    border-radius: 8px;
}
.paypal_tip .p_tip a:hover{
    background-color:#1D4ED8;
}
.paypal_tip .p_tip a svg{
    
}
.shbox.participants h2 svg{
    color: rgb(59 130 246);
}
.shbox.bills h2 svg{
    color: rgb(168 85 247);
}
.settlements_box h2 svg{
    color:rgb(20 184 166);
}
.empty-box{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    padding: 20px 0;
    color: #aaa;
}
.empty-box span{
    color: #888;
    font-weight: 600;
}
#settlements_empty_box{
    gap: 5px;
}
#settlements_empty_box h5{
    color: rgb(22 163 74);
    margin: 0;
}
#settlements_empty_box p{
margin: 0;
}
.shbox.new_bill h2 svg{
    color: rgb(34 197 94);
}
.shbox.new_bill p{
    font-size: 0.9rem;
}
.share_box a svg{
    vertical-align: middle;
}
.share_box a.share_url svg{
    vertical-align: baseline;
}

.akgroup_page h2{
    font-weight: bold;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    font-size: 1.5rem;
    gap: 10px;
    margin-top: -5px;
}
.akgroup_page .shbox.bills.inner_bill_cont h2{
    margin-bottom: 5px;
}
.akgroup_page h3{
    font-size: 1.2rem;
    font-weight: 600;
}
.rs_ad{
  position: fixed;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  max-width:300px;
  max-height:600px;
  text-align: center;
}
.bfw_ad{
  position: fixed;
  left: 50%;
  bottom: 5px;
  transform: translateX(-50%);
  text-align: center;
}
.bst_ad,.bst_adm,.bab_adm{
  width: 100%;
  max-width: 100%;
  margin-top: 30px;
  height: auto;
  text-align: center;
}/* Email received has shortcodes here, is it a bug? */
.bab_adm{
  margin-top: 0;
  margin-bottom: 20px;
  text-align: center;
}
.e_conts .econt{
  position: relative;
  padding-bottom: 10px;
  display: flex;
  gap: 10px;
}
.e_conts .econt .del_email,.items_cont .itm .inps .del_item{
  cursor: pointer;
  align-items: center;
  justify-content: center;
  display: flex;
  padding: 5px 15px;
  text-align: center;
  color: rgb(220 38 38);
  border-radius: 10px;
  display:none;
}
.e_conts .econt .del_email:hover, .items_cont .itm .inps .del_item:hover{
  background: #FEF2F2;
  color: rgb(220 38 38);
}
.submit_cont .akbutton{
  display: flex;
  flex-direction: row;
  gap:8px;
  justify-content: center;
  align-items: center;
}
.share_em_box{
  position: relative;
  padding-top: 10px;
  padding-bottom: 0;
}
.share_em_box .more_but_cont{
  position: absolute;
  right: 0;
  top:10px;
}
.share_em_box .more_but_cont a{
  color: rgb(29 78 216) !important;
  font-size:0.85rem;
  line-height: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap:3px;
  font-weight: 600;
}
.share_em_box label svg{
  vertical-align:middle;
}
.more_but_cont .more_emails{
  color: #fff !important;
  cursor: pointer;
}
#email_share_form .submit_cont .close_but{
  position:static;
}
#email_share_form .success{
  background: #F0FDF4;
  color: rgb(22 163 74);
  border: 1px solid rgb(187 247 208);
  padding: 10px;
  border-radius: 10px;
  margin-top: 15px;
  display:none;
}
#email_share_form .success svg{
  vertical-align:middle;
}
.bill_pic{
  text-align: center;
}
.bill_pic img{
  margin-top: 10px;
  width: auto;
  height: 150px;
}
.bill_img{
  padding-top:10px;
  position: relative;
}
.bill_img img{
  width: auto;
  height: 100px;
  cursor: pointer;
}
.bill_img .delp{
  position: absolute;
  left: -7px;
  top: 3px;
  cursor: pointer;
  color: #c36 !important;
}
.bill_img .delp:hover{
  color: #000 !important;
}
.already_shared{
  flex-direction: column;
  gap: 10px;
  padding-top:20px;
  display: none;
}
.already_shared h5{
  margin-bottom: 0;
}
.already_shared .semail{
  padding: 12px 15px;
  border-radius: 10px;
  position: relative;
  font-weight: 500;
  background-color: rgb(249 250 251);
}
#imageOverlay {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0, 0, 0, 0.9);
  justify-content: center;
  align-items: center;
  z-index: 9999;
  text-align: center;
  align-items: center;
  transition: all .3s;
}

/* Image inside overlay */
#imageOverlay img {
  max-width: 95%;
  max-height: 95%;
  border-radius: 8px;
  box-shadow: 0 0 20px rgba(0,0,0,0.5);
  cursor: zoom-out;
}
.akfloat h2{
  border-bottom: 1px solid rgb(229 231 235);
  padding-bottom: 20px;
  margin-top: -5px;
}
.items_cont{
  margin-top: 25px;
  border-top: 1px solid #e5e7eb;
  padding: 20px 0;
  font-size: 0.85rem;
}
.items_cont .ishead{
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
}
.items_cont .ishead .t{

}
.items_cont .ishead .t h3{
  font-size: 1.2rem;
  margin-bottom: 5px;
}
.items_cont .ishead .add_item{
  background: rgb(59 130 246);
  color: #fff !important;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 6px 10px;
  white-space: nowrap;
  border-radius: 5px;
  cursor:pointer;
  gap: 5px;
}
.items_cont .ishead .add_item:hover{
background:rgb(37 99 235);
}
.items_cont .its_main{
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.items_cont .its_main .itm{
  background: #F9FAFB;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid rgb(229 231 235);
  display: flex;
  flex-direction: column;
}
.items_cont .itm .inps{
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
}
.items_cont .itm .inps .input_cont{
  padding-bottom:0;
}
.items_cont .itm .inps .curr_imp{
  max-width: 110px;
}
.items_cont .itm .inps .desc{
  flex: 1 1 0%;
}
.items_cont .itm .inps .curr_imp .curr_sign{
  top: 11px;
}
.items_cont .itm .inps .curr_imp input{
  padding-left: 27px;
}
.items_cont .itm .inps .del_item{
  display: block;
  padding: 10px 15px;
}
.items_cont .itm .inp_mems{
  display: flex;
  flex-direction: column;
  padding-top: 12px;
}
.items_cont .itm .inp_mems .itm_split_box{
  margin: 0;
  padding: 10px 0;
  gap: 5px;
}
.items_cont .itm .inp_mems .itm_split_box label{
padding: 5px 8px;
}
.items_cont .itm .inp_mems .assi_to{
line-height: 1.5;
}
.ttl_itm_break{
  background: #EFF6FF;
  padding: 15px;
  margin-top: 15px;
  border-radius: 10px;
  border: 1px solid rgb(191 219 254);
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.ttl_itm_break .itm_break{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  font-size: 0.9rem;
}
.ttl_itm_break .itm_break .itm_amt{
font-weight: 500;
}
.ttl_itm_break .itm_break.uns{
  border-top: 2px solid rgb(147 197 253);
  margin-top: 8px;
  padding-top: 7px;
  border-bottom: 1px solid rgb(147 197 253);
  padding-bottom: 8px;
}
.ttl_itm_break .itm_break.uns .itm_amt{
  color: rgb(22 163 73);
}
.ttl_itm_break p{
  font-size: 0.75rem;
}
.ttl_itm_break p.err_msg{
  display: none;
}

#bill_form.akfloat {
  max-width:850px;
}

@media screen and (max-width: 991px) {
  .akgroup_page .shbox {
    padding: 1.5rem;
  }
  .share_box a{
    padding: 7px 10px;
    min-width: 105px;
    text-align: center;
  }
  .akgroup_page{
    padding: 30px 10px 30px 10px;
  }
  
  .akrecent_groups .r_row .r_box{
    display: flex;
    flex-direction: row;
    text-align: center;
    align-items: center;
  }
  .akrecent_groups .r_row .r_box span{
    display: none;
  }
}

@media screen and (max-width: 768px) {
    .share_box a svg{
        vertical-align: middle;
    }
  .flex-box {
    flex-direction: column;
  }
  .forms_box_cont{
    flex-direction: column;
  }
  .forms_box_cont .shbox{
    width: 100%;
    padding: 1rem;
  }
  .forms_box_cont .inner_bill_cont{
    width: 100%;
  }
  .bills_cont .sbill h3{
    display: flex;
    flex-direction: column;
  }
  .bills_cont .sbill span.currr{
    position: static;
    text-align: left;
    margin: 5px 0 3px 0;
  }
  .akrecent_groups .r_row .l_box .i_box{
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
  }
  .title_box{
    line-height: 1.2;
  }
  .gtitle{
    font-size: 1.3rem;
  }
  .gtitle svg {
    width: 24px;
    height: 24px;
    vertical-align: bottom;
  }
  .akgroup_page h2{
    font-size: 1.3rem;
  }
  .akgroup_page h2 svg{
    vertical-align: middle;
  }
  .paypal_tip{
    font-size: 0.85rem;
  }
  .paypal_tip h4{
    font-size: 1rem;
  }
  .paypal_tip .p_tip{
    flex-direction: column;
    gap: 10px;
  }
  .settlements_box{
    padding:2rem 0.8rem;
  }
  .transactions_cont{
    padding: 0;
  }
}

@media screen and (max-width: 600px) {
  
}

@media screen and (max-width: 480px) {
  .share_box{
    display: inline-block;
  }
  .share_box a{
    margin-right: 5px;
    margin-top: 5px;
    font-size: 0.86rem;
    padding: 4px 7px;
    height: auto;
    min-width: 0;
    gap: 3px;
  }
  .akrecent_groups .r_row .l_box{
    font-size: 0.7rem;
  }
  .akrecent_groups .r_row .l_box h3{
    font-size: 1rem;
  }
  .transactions_cont .tran-row{
    flex-direction: column;
    text-align: left;
    align-items: flex-start;
    justify-content: left;
  }
  .tran-row .amount{
    margin: 5px 20px 5px 0;
  }
  .shbox.bills .total_amt{
    font-size: 1.1rem;
  }
  .transactions_cont .tran-row .amt-info{
    justify-content: space-between;
    width: 100%;
  }
  .share_box_cont{
    text-align: left;
  }
  .title_box .calcs,.share_box_cont .calcs{
    text-align: left;
  }
  .settlements_box .stitle{
    flex-direction: column;
  }
  .akgroup_page .shbox{
    padding: 1rem;
    gap: 10px;
  }
  .title_box{
    margin-top: 0;
    font-size: 0.86rem;
  }
  .title_box p{
    margin-bottom:5px;
  }
  .akgroup_page h2{
    margin-top:5px;
  }
  .settlements_box .stitle .sbuttons{
    padding-bottom: 10px;
  }
  .settlements_box .audit_cont, .settlements_box .export_cont{
    margin-top: 5px;
    font-size: 0.8rem;
  }
  .split_box_label{
    gap: 10px;
  }
  .imp_msg_bold{
    padding-bottom: 5px;
  }
  .member_cont .mem{
    padding: 7px 10px;
    font-size: 0.92rem;
  }
  .input_cont input, .input_cont select{
    padding: 10px 13px;
    min-height: 0;
  }
  .settlements_box .audit_cont .au_inner{
    gap:2px;
  }
  .settlements_box .audit_cont h3{
    margin-bottom: 8px;
  }
  .settlements_box .export_cont .extitle{
    flex-direction: column;
    gap: 0px;
    padding-bottom: 7px;
  }
  .settlements_box .export_cont .extitle .excopy{
    margin-right: auto;
  }
  .settlements_box .export_cont textarea{
    font-size: 0.8rem;
  }
  .settlements_box .extitle h3{
    margin-bottom: 5px;
  }
}