/* Workshops Index */
.abtcrscon-index { max-width:1100px; width: 96%;  margin: 0px auto; font: normal 22px 'Yanone Kaffeesatz', sans-serif; color: #595959; text-align:justify; line-height:22px;  padding-top:20px;}
.abtcrscon-index h2 {text-align: center; font-family:arial;font-size:20px; line-height:20px; font-weight: normal; color:#777; margin:10px auto 30px auto; }
.abtcrscon-index h2 span:first-child{ display:block;font: normal 35px 'Yanone Kaffeesatz', sans-serif; line-height:35px;text-transform: uppercase;letter-spacing:2px;	padding:0px;color: #EF5455; margin-bottom:5px; }

#wrkshops{ background-image: url('srch.png'); background-position: 10px 12px;  background-size: 25px 25px;  background-repeat: no-repeat; font-size: 16px; padding: 15px 5px 15px 40px;  border: 1px solid #ddd;  border-radius:10px;outline:none;width:calc(70%); margin:0px auto 10px auto;}

.wrksrch {display:flex;margin: 12px auto 0px auto;justify-content: space-between; }
.wrksrch a {border: none;  background-color: #EB268F;  padding: 10px 12px;  border-radius: 5px;  cursor: pointer;  letter-spacing: 2px;  font-size: 20px; line-height:20px;  color: #fff; transition: 1s;align-self: center; text-transform:uppercase;}
.wrksrch a:hover {background-color:#00B0F0;}
@media all and (max-width: 500px) {
.wrksrch {flex-direction: column;}
#wrkshops {width:100%; margin-bottom:10px;}}
@media (min-width: 501px) and (max-width: 800px) {#wrkshops {width: calc(100% - 170px);}}

.wrkshps { display: grid;  grid-template-columns: repeat(3,1fr); grid-gap: 15px; margin-top:10px;list-style:none;}
.wrkshps a { display:block;text-decoration:none; color:#555; padding: 7px;font-size:14px; line-height:16px; background-color: #fff; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); cursor:pointer; transition:400ms; position:relative;}
.wrkshps a span{ display:block; text-align: center;font-family: arial;font-size: 13px;line-height: 16px; }
.wrkshps a span:nth-child(2){font: normal 22px 'Yanone Kaffeesatz', sans-serif;color: #EF5455;letter-spacing: 1px; margin-top:10px;}
.ttlspn a span:nth-child(2){margin-bottom: 5px; margin-top: 8px !important;}
.wrkshps a span:nth-child(3) {  color: #555; margin:0px;}
.wrkshps a span:last-child { color: #fff; background-color: #607d8b; padding: 5px; width: 90px; border-radius: 5px;  margin: 7px auto 3px auto !important; transition:1s;}
.wrkshps a span:last-child:hover {background-color:#EB268F;}
.wrkshps a:hover{ transform:translatey(-12px);}
.wrkshps .fa {position: absolute; right: 16px; bottom: 15px; padding: 6px; border-radius: 100px; font-size: 15px; width: 30px; height: 30px; line-height: 17px; text-align: center; box-shadow:0px 1px 3px rgba(0, 0, 0, 0.5); transition:1s;}
.wrkshps .fa:hover {background-color:#b8e9fb;}
.wrkshps img {height: auto; vertical-align: middle; width: 100%;}
.corprt {bottom: 10px !important; width: 26px !important; height: 26px !important; font-size: 12px !important; line-height: 15px !important; }
@media all and (max-width: 550px){.wrkshps {grid-template-columns: repeat(1,1fr);}}
@media (min-width: 550px) and (max-width: 780px) {.wrkshps {grid-template-columns: repeat(2,1fr);}}
.wrkshp-acty  {display: flex; justify-content: center;  font: normal 22px 'Yanone Kaffeesatz', sans-serif;  line-height: 25px;  text-align: center;}
.wrkshp-acty a{ padding: 10px;  background-color: #999;  border-radius: 4px;  margin-right: 5px;  margin-bottom: 8px;  color: #fff;letter-spacing:1px;transition:1s;}
.wrkshp-acty a:hover {background-color:#00B0F0;}
.wrkactv { background-color:#EB268F !important;}
@media all and (max-width: 375px){.wrkshp-acty {flex-direction:column;}}

/* Workshops Banner*/
.banner-pic { display:flex; background-color:#fff;box-shadow:0px 4px 4px 0px rgba(0,0,0,0.3); padding:4px 0px;}
.banner-pic img {width:100%;}
@media all and (max-width: 768px){
.banner-pic img:first-child {width:50%;}
.banner-pic img:last-child {width:50%;}}
@media all and (max-width: 640px){
.banner-pic { flex-direction:column;}
.banner-pic img:first-child {width:100% !important;}
.banner-pic img:last-child { display:none;}}






/* Workshops Pages */
.abtcrscon { max-width:1000px; width: 96%;  margin: 0px auto; font: normal 22px 'Yanone Kaffeesatz', sans-serif; color: #595959; text-align:justify; line-height:22px;  padding-top:20px;}
.abtcrscon h2 {text-align: center; font: normal 28px 'Yanone Kaffeesatz', sans-serif; font-weight: normal; color:#777; margin:10px auto 30px auto; }
.abtcrscon h2 span:first-child{ display:block; font-size:35px; line-height:35px;text-transform: uppercase;letter-spacing:2px;	padding:0px;color: #EB268F; margin-bottom:5px; }
.abtcrscon p {display:block; padding:25px 10px; border-bottom:1px solid #99999985; border-top:1px solid #99999985; margin-top:40px; font-family: arial; font-size: 18px; color: #555; line-height: 26px; text-align:center;}
.abtcrscon p span {display:block; color:#EB268F; font: normal 42px 'Yanone Kaffeesatz', sans-serif; line-height:42px; letter-spacing:1px; margin-bottom:5px;}

.wrkshpin {display:flex; justify-content:center; margin:30px auto; gap: 20px;}
.wrkshpin-lft {text-align:center; width:calc(100% - 410px);}
.wrkshpin-lft img {width:100%; border: 3px solid #fff;  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5); transition:1s; border-radius:15px;}
.wrkshpin-rgt {display:flex; width:400px; padding:20px; border-radius:15px; flex-direction: column; justify-content: center; background-color:#f1f1f1;}
.wrkshpin-rgt2 {display:flex; width:470px; padding-left:15px; flex-direction: column; justify-content: center;}
@media all and (max-width: 480px){.wrkshpin {width: 100% !important;}}
@media all and (max-width: 977px){
.wrkshpin { flex-direction: column;width: 97%;  margin: 15px auto;}
.wrkshpin-lft {width: 100%;}
.wrkshpin-rgt { width: 100%;}
.wrkshpin-rgt2 { width: 100%; padding-left: 0px; margin-top: 10px;}}

.campbtns { display:flex; gap:10px; justify-content: center;}
.campbtns a { padding: 10px; border-radius: 4px; background: #557b89a3;  color: #fff; font: normal 18px 'Yanone Kaffeesatz', sans-serif;  line-height: 15px;  letter-spacing: 2px;
text-decoration: none;  transition: 0.3s; transition:1s;}
.campbtns a .fa {color: #333;}
.campbtns a:hover { background: #09ace4; color: #fff;}
.campbtns a.active { background: #eb268f; color: #fff;}
.campbtns a.active .fa,.campbtns a:hover .fa {  color: #fff;}
.cmp-hdng { display:block;font: normal 25px 'Yanone Kaffeesatz', sans-serif;  color: #EB268F;text-transform: uppercase;letter-spacing: 2px; padding-bottom:10px; margin:10px auto 10px auto !important}
@media all and (max-width: 230px){.campbtns {flex-direction: column;}}
@media all and (max-width: 280px){.campbtns a .fa { display: none;}}



.regd-box {border-bottom:1px solid #ccc; border-top: 1px solid #ccc; padding:20px 0px}
.regd-box li{ display:flex; font-family:arial; font-size: 16px; padding: 12px 5px;color:#595959;}
.regd-box li:first-child { padding:0px 5px 15px 5px;}
.regd-box li .fa{ font-size:16px;margin-right:4px;}
.regd-box li span:first-child{ width:130px;}
.regd-box li span:nth-child(2){padding:0px 15px; width:10px;}
.regd-box li span:nth-child(3){ width:calc(100% - 140px);text-align:left;}


@media all and (max-width: 480px){
.regd-box li {flex-direction: column;  border-bottom: 1px solid #99999985;}
.regd-box li:last-child{border:none;}
.regd-box li span:first-child {  width: 100%;}
.regd-box li span:nth-child(2) { display:none;}
.regd-box li span:last-child { font-weight:bold;  margin-top: 4px; padding-left: 24px;}
.regd-box li .fa {width: 15px;}

}









/* Save Workshops */
.saved-workshops-empty {text-align: center; padding: 30px;  background: #f5f5f5; border-radius: 10px; color: #555; font-size: 18px;}
.saved-workshop-list {list-style: none; padding: 0; margin: 0;}
.saved-workshop-item {display: flex; align-items: center; gap: 15px; padding: 18px 20px; margin-bottom: 14px; background: #f7f7f7; border-left: 5px solid #00B0F0; border-radius: 8px;font-family: arial;  font-weight: normal; color: #777;}
.saved-workshop-title {font-size: 20px;text-align:left;	width:100%;}
.saved-workshop-actions {display: flex; gap: 10px;flex-shrink: 0;}
.saved-workshop-view, .saved-workshop-remove { display: inline-block; border: none; padding: 9px 14px; border-radius: 5px; font-size: 15px; cursor: pointer; text-decoration: none;color: #fff;}
.saved-workshop-view { background: #00B0F0;}
.saved-workshop-remove { background: #EB268F;}
.saved-workshop-view:hover, .saved-workshop-remove:hover {opacity: 0.85;}
.saved-workshop-image { width: 75px; height: 75px; object-fit: cover; border-radius: 8px; border: 1px solid #ddd;transition: 0.3s;}
.saved-workshop-image-link { display: block; width: 75px; flex-shrink: 0;}
.saved-workshop-image-link:hover .saved-workshop-image { opacity: 0.85;  transform: scale(1.03);}
@media (max-width: 285px) {.saved-workshop-actions {flex-direction: column;}}
@media (max-width: 700px) {.saved-workshop-item {flex-direction: column; align-items: flex-start;}}











/*
@media all and (max-width: 240px){.abtcrscon {font-size:9.5vw;}}
@media (min-width: 480px) and (max-width: 640px) {.abtcrscon { font-size:3.5vw;}}
@media all and (max-width: 1099px){.abtcrscon {width:100%; padding:5px;}}


@media all and (max-width: 640px){.abtcrscon h1 span{ display:block;}}

*/
















/*

.wrksplst { display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 8px; margin-top:10px;}
.wrksplst li a{ display:flex; border: 1px solid #999; padding: 6px; border-radius: 2px; align-items: center;}
.wrksplst li a span{ display:flex; text-align: left;font-family: arial;font-size: 13px;}
.wrksplst li a span:nth-child(1){color: #EF5455; font-weight:bold; width:calc(100% - 100px);}
.wrksplst li a span:nth-child(2) {  color: #555; margin:0px; width:80px;}
.wrksplst li a .fa {color: #777; margin:0px; width:20px; text-align:center;}
.wrksplst li:hover {background-color:#00b7f242;}

.wrksplstcorp { display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 8px; margin-top:10px;}
.wrksplstcorp li a{ display:flex; border: 1px solid #999; padding: 6px; border-radius: 2px; align-items: center;}
.wrksplstcorp li a span{ display:flex; text-align: left;font-family: arial;font-size: 13px;}
.wrksplstcorp li a span:nth-child(1){color: #EF5455; font-weight:bold;}
.wrksplstcorp li a span:nth-child(2) {  color: #555; margin:0px;}
.wrksplstcorp li a .fa {color: #777; margin:0px; width:20px; text-align:center;}
.wrksplstcorp li:hover {background-color:#00b7f242;}
.wrksplstcorp li .corpt {width:100%;}

.wrkero {float: right; padding-right: 5px;font-size: 21px; color: #555; margin-top:-5px; transition:1s;}
.wrkero:hover {color:#EB268F; transform:scale(1.5,1.5);}

.wrkshp-abt ul { list-style: disc; padding-left: 20px;}

.sanamm { font-family:arial; font-size:14px;}	
.cyans a{ text-decoration:none; color:#555; display:block;}
.cyans:hover {background-color:#00B0F0; color:#fff;}
.cyans a:hover {color:#fff;}
.mgntas a{ text-decoration:none; color:#555; display:flex;}
.mgntas:hover {background-color:#EB268F; color:#fff;}
.mgntas a:hover {color:#fff;}
.wrkshp-spl { display:grid; justify-content:space-between; grid-template-columns: repeat(6,1fr);grid-column-gap: 5px; margin:10px auto 20px auto;}
.wrkspin { display:flex;text-align:left; font-family:arial; font-size:14px; line-height:16px;background-color:#555; padding:8px; color:#fff; letter-spacing:1px;border-radius:5px;}
@media all and (max-width: 320px){
.wrkshp-spl {grid-template-columns: repeat(1,1fr);}
.wrkspin {margin-top:5px;}
.spl-wrkshps { grid-template-columns: repeat(1,1fr);}}
@media (min-width: 320px) and (max-width: 375px) {.spl-wrkshps { grid-template-columns: repeat(2,1fr);}}
@media (min-width: 375px) and (max-width: 480px) {.spl-wrkshps { grid-template-columns: repeat(2,1fr);}}
@media (min-width: 480px) and (max-width: 640px) {
.wrkshp-spl {grid-template-columns: repeat(2,1fr);}
.wrkspin {margin-top:5px;}}
@media (min-width: 480px) and (max-width: 640px) {.spl-wrkshps { grid-template-columns: repeat(3,1fr);}}
@media (min-width: 640px) and (max-width: 768px) {
.wrkshp-spl {grid-template-columns: repeat(3,1fr);}
.wrkspin {margin-top:5px;}}
@media (min-width: 640px) and (max-width: 768px) {.spl-wrkshps { grid-template-columns: repeat(5,1fr);}}
@media (min-width: 768px) and (max-width: 977px) {
.wrkshp-spl {grid-template-columns: repeat(3,1fr);}
.wrkspin {margin-top:5px;}}
@media (min-width: 768px) and (max-width: 1023px) {.spl-wrkshps { grid-template-columns: repeat(6,1fr);}}
@media (min-width: 978px) and (max-width: 991px) {
.wrkshp-spl {grid-template-columns: repeat(3,1fr);}
.wrkspin {margin-top:5px;}}
@media (min-width: 978px) and (max-width: 1099px) {.spl-wrkshps li span { font-size:16px;}}


*/







/* CAN DELETE
.wrks-grid {display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px;}
.wrks-grid a { background-color:#FC0; transition:300ms; position:relative; text-align:center; border-radius:10px; overflow:hidden; color:#000; font: normal 20px 'Yanone Kaffeesatz', sans-serif;  color: #ffff; line-height:22px;  padding:8px 0px; letter-spacing:1px;}
.wrks-grid a:hover{ box-shadow:0px 0px 10px rgba(0, 0, 0, 0.5); transform:translatey(-10px); border-radius:5px;}
.wrks-grid img {width:100%;}

.wrks-grid a:nth-child(1){ background-color:#F69;}
.wrks-grid a:nth-child(2){ background-color:#36C;}
.wrks-grid a:nth-child(3){ background-color:#F30;}
.wrks-grid a:nth-child(4){ background-color:#3c9802;}
.wrks-grid a:nth-child(5){ background-color:#9F28B0;}
.wrks-grid a:nth-child(6){ background-color:#F90;}
.wrks-grid a:nth-child(7){ background-color:#00B0B0;}
.wrks-grid a:nth-child(8){ background-color:#591eb9;}
.wrks-grid a:nth-child(9){ background-color:#6fca0b;}

@media all and (max-width: 375px){
.wrks-grid {grid-template-columns: repeat(1, 1fr);}

}
@media (min-width: 375px) and (max-width: 480px) {
.wrks-grid {grid-template-columns: repeat(2, 1fr);}
.wrks-grid a {font-size:4vw;}
.wrks-grid a:last-child {display:none;}
}
@media (min-width: 480px) and (max-width: 640px) {
.wrks-grid {grid-template-columns: repeat(2, 1fr);}
.wrks-grid a:last-child {display:none;}
}

@media (min-width: 640px) and (max-width: 768px) {
.wrks-grid {grid-template-columns: repeat(2, 1fr);}
.wrks-grid a:last-child {display:none;}
}
@media (min-width: 768px) and (max-width: 977px) {
.wrks-grid {grid-template-columns: repeat(3, 1fr);}
}
@media (min-width: 978px) and (max-width: 1099px) {
.wrks-grid {grid-template-columns: repeat(3, 1fr);}
}

@media all and (min-width: 1100px){	
.wrks-grid a:last-child {display:none;}
}

*/
















/*.reg-del-con .lh{ left:-10px;  bottom:0; transform: scalex(-1);}*/
.regd-btns { display:inline-block;text-align:left; font-family:arial; font-size:14px; line-height:16px;background-color:#555; padding:12px; color:#fff; letter-spacing:1px;border-radius:5px; transition:1s;}
.regd-btns:hover {background-color:#00B0F0;}
.regd-btns .fa {font-size: 22px; font-weight:normal; margin-right:8px; color:#FFCC33;}
.regd-btns span {font: normal 24px 'Yanone Kaffeesatz', sans-serif; color:#fff;}

.regd-box2{ display:flex; font-family:arial; font-size: 14px; padding: 5px;color:#595959;}
.regd-box2:first-child { padding:0px 5px 5px 5px;}
.regd-box2 .fa{ font-size:16px;margin-right:4px;}
.regd-box2 span:first-child{ width:140px;}
.regd-box2 span:nth-child(2){margin:0px 15px;font-weight:bold;}
@media all and (max-width: 480px){
.regd-box2 {flex-direction: column;  border-bottom: 1px solid #99999985;}
.regd-box2:last-child{border:none;}
.regd-box2 span:first-child {  width: 100%;}
.regd-box2 span:nth-child(2) { display:none;}
.regd-box2 span:last-child { font-weight:bold;}}
@media all and (max-width: 977px){
.regd-box2 { padding: 15px 5px;}
.regd-box2:first-child { padding: 0px 5px 15px 5px;}}
.btn-cntrs {display: block; text-align: center; padding-top: 10px; border-top: 1px solid #99999985;}
.pmts-lnk { display:block; margin-top:5px; font-family:arial; color: #0058B0; font-size: 14px; transition:1s;}
.pmts-lnk:hover {color:#EB268F;}
@media all and (max-width: 977px){.btn-cntrs { text-align:left;}}
.wrks-booking {display:flex; flex-direction:column;text-align: -webkit-center; margin-top:20px;} 
.wrks-booking  textarea {max-width:800px; width:97%; padding:12px; border:1px solid #777;}
.wrks-booking h2 { font: normal 35px 'Yanone Kaffeesatz', sans-serif; color: #2b3252; text-align: center;  margin-top: 10px; letter-spacing:1px;}
.wrks-book { display: flex; max-width:800px;  width: 97%; justify-content: space-between; justify-self:center;margin-top:10px;}
.wrks-bkngfrm { width:49%; display:flex; flex-direction:column; }
.wrks-bkngfrm input{   font-family: arial;  font-size: 15px;margin:10px 0px;  color: #5B5B5B;padding: 19px 12px; border: 1px solid #777;    border-radius: 3px;  background: transparent;}
.wrks-booking select{   font-family: arial;  font-size: 15px;margin:10px 0px;  color: #5B5B5B;padding: 18px 12px; border: 1px solid #777; border-radius: 3px;  background: transparent;}
.wrks-bttn input[type="button"] { display:block;background: #00B0F0;font-family: arial; text-transform: uppercase;letter-spacing: 5px; font-size: 14px;margin:15px auto;  color: #fff;padding: 15px 18px 15px 25px; border:none;  border-radius: 5px;transition: 1s; cursor:pointer; }
.wrks-bttn input[type="button"]:hover {background-color:#EB268F;}

@media all and (max-width: 600px){
.wrks-book  { flex-direction:column;}
.wrks-bkngfrm {width:100%;}}



.regd-boxfull{ display:flex; flex-direction:column;}
.regd-boxfull li {display:flex; flex-direction:column; font-family:arial; font-size: 14px; padding: 5px;color:#555;}
.regd-boxfull li span:first-child{color:#EB268F;}
.regd-boxfull li .fa{ font-size:16px;margin-right:4px;}

.corpcont { border-top:1px solid #999; padding-top:20px; }
.corpcont h2 {color:#EB268F; font-size:30px; margin:35px auto 0px auto;}
.corpcont h2 .fa{margin-right:5px;}
.corpcont ul {display:flex; justify-content:center; gap:20px;font-family:arial; font-size: 16px; letter-spacing:.5px; padding: 5px;color:#555; }
.corpcont ul li span a { text-decoration:none; color:#0058B0; transition:1s;}
.corpcont ul li span a:hover {color:#EB268F;}




/*
	
.bkngfrm100 input{ width:100%;  font-family: arial;  font-size: 15px;margin:10px 0px;  color: #5B5B5B;padding: 19px 12px; border: 1px solid #777;    border-radius: 3px;  background: transparent;}
.bkngfrm100 textarea{ width:100%;  font-family: arial;  font-size: 15px;margin:10px 0px;  color: #5B5B5B;padding: 19px 12px; border: 1px solid #777;    border-radius: 3px;  background: transparent;}
.bkngfrm select{   font-family: arial;  font-size: 15px;margin:10px 0px;  color: #5B5B5B;padding: 18px 12px; border: 1px solid #777; border-radius: 3px;  background: transparent;}
.book-event{ display:flex; width:100%;justify-content: space-between; margin:25px auto 0px auto;}	
.crseoptns { border-bottom:1px solid #999;}
.crseoptns li { margin-bottom:8px;}
.crseoptns li span {border-right:1px solid #999; font-weight:normal;padding-right: 11px; margin-right: 3px;}
.crseoptns li span:nth-child(1) { border:none;}
.crseoptns li span:nth-child(2) {border:none;}
.crseoptns li span:last-child {padding:0px; margin:0px;border:none;}
.crseoptns a {text-decoration:none; color:#0058B0;}
.crseoptns a:hover { color:#EB268F;}





*/



.hbycls li {border: 1px solid #999; padding: 6px; border-radius: 2px;}
/*.wrkspin:last-child{ font-size:17px; align-items:center; text-transform:uppercase; cursor:pointer; transition:1s;} 
.wrkspin:last-child:hover{ background-color:#00B0F0;}
*/
.wrkspin .fa {font-size: 28px; font-weight:normal; margin-right:8px; color:#FFCC33;}
.wrkopn {color:#FFCC33;}
.wrkopn span {display:block; font-weight:normal; color:#fff; margin-top:3px;}






.regd-coprt{  display:flex; flex-direction:column; font-family:arial; font-size: 14px; text-align:justify; padding: 6px 0px; color:#555; border-bottom:1px solid #9999996b;}
.regd-coprt .fa{font-size:16px;margin-right:4px;}
.regd-coprt span:first-child{color:#EF5455;}
.regd-coprt span ul li{list-style: none; margin: 0px 0px 0px 22px;}
.formErrors {color:red; font-weight:bold;padding-left:10px;}
.spleror {display: block;  text-align: center; letter-spacing: 2px; font-weight: normal; text-transform: uppercase;color:red; padding:0px;}

.rss-block {display:flex; justify-content: center; align-items:center;}


	


/* Payment Options */
.workshop-actions { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center;  gap: 14px; padding-top: 25px;}
@media all and (max-width:300px){
.workshop-actions { display: flow-root;  padding-top: 5px;text-align: center;}
.workshop-action-btn {display:inline-block; margin-right:10px; margin-top:12px;}}
.workshop-action-btn { display: inline-flex; flex: 0 0 46px; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 50%;
    background: #09ace4; color: #fff; font-size: 20px; text-decoration: none; cursor: pointer; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.18); transition: background 0.2s ease, transform 0.2s ease;}
.workshop-action-btn i { margin: 0; color: inherit; font-size: 20px;}
.workshop-action-btn:hover, .workshop-action-btn:focus {outline: none; background: #f3268c; color: #fff; text-decoration: none;  transform: translateY(-3px);}
.workshop-action-btn.is-saved { background: #f3268c;}
.workshop-action-message { position: absolute; margin-top: 90px; padding: 5px 10px; border-radius: 4px; background: #333;color: #fff; font-size: 12px; white-space: nowrap;}

/* Payment POPUP */
body.payment-popup-open { overflow: hidden;}
.payment-popup { position: fixed; z-index: 999999; inset: 0; display: none; align-items: center; justify-content: center; padding: 15px; background: rgba(0, 0, 0, 0.72);}
.payment-popup.is-open {display: flex;}
.payment-popup-box { position: relative; box-sizing: border-box; width: 100%; max-width: 475px; max-height: calc(100vh - 24px); overflow-y: auto; padding: 20px; border-radius: 16px; background: #fff; text-align: center;box-shadow: 0 10px 35px rgba(0, 0, 0, 0.4);}
.payment-popup-box h3 {margin: 0 35px 14px;color: #f3268c; font-size: 25px;font-weight: normal;}
.payment-popup-close { position: absolute; top: 7px; right: 14px; padding: 0; border: 0; background: transparent; color: #555; font-size: 32px; line-height: 1; cursor: pointer;}

/* Payment Tabs */
.payment-tabs { position: sticky; z-index: 5; top: -20px; display: flex;  gap: 5px; padding: 5px 0 8px; background: #fff;}
.payment-tab {display: flex; flex: 1; align-items: center;  justify-content: center; gap: 5px; min-height: 40px; padding: 8px 5px;  border: 1px solid #0daee5;  border-radius: 6px; background: #fff; color: #087fae;  font-family: inherit; font-size: 12px; cursor: pointer;}
.payment-tab i { font-size: 16px;}
.payment-tab:hover, .payment-tab:focus, .payment-tab.active { outline: none; border-color: #f3268c; background: #f3268c; color: #fff;}

/* Payment Penels */
.payment-panel {display: none; box-sizing: border-box; min-height: 220px;}
.payment-panel.active {display: block;}

/* QR Code */
.payment-qr { display: block; width: 175px; max-width: 85%; height: auto; margin: 0 auto 10px;}
.payment-qr img {width:100%;}
.payment-help { margin: 5px 0; color: #666;font-size:14px;}

/* UPI Details */
.upi-box, .card-payment-box {padding: 18px 10px;}
.upi-box, .card-payment-box .fa {font-size:35px;}
.upi-main-icon, .card-main-icon { display: block; margin: 0 auto 8px; color: #0daee5;  font-size: 70px; line-height: 1;}
.upi-box p { margin: 4px 0; color: #555; font-size:20px;}
.upi-id { display: block;  margin-top: 25px; color: #222; font-size: 21px; word-break: break-word;}
.copy-upi-button { display: block; margin: 35px auto 0px auto;}
.copy-upi-button .fa {font-size:16px; padding-right:5px}

/* Copy Button */
.copy-upi-button, .copy-bank-button {padding: 9px 15px;font-size: 16px; border: 0; border-radius: 5px; background: #0daee5; color: #fff; font-family: inherit; cursor: pointer;}
.copy-upi-button:hover, copy-upi-button:focus, .copy-bank-button:hover, .copy-bank-button:focus { outline: none; background: #f3268c;}
.copy-status { min-height: 18px; margin-top: 7px; color: #07864b; font-size: 13px; font-weight: bold;  text-align: center;}

/* Bank Details Tabs */
.payment-bank-details { padding: 12px; border-radius: 9px;background: #f5f5f5; text-align: left;}
.bank-detail-row { display: grid; grid-template-columns: 115px 10px 1fr; gap: 5px; align-items: start;font-size:13px;  padding: 10px 0; border-bottom: 1px solid #ddd;}
.bank-detail-row:last-of-type { border-bottom: 0;}
.bank-detail-row span { color: #555;}
.bank-detail-row b { font-weight: normal;}
.bank-detail-row strong { text-align: left; word-break: break-word;}
.copy-bank-button {display: block; margin: 15px auto 0;}
@media all and (max-width: 360px){
.bank-detail-row { display: flex; flex-direction: column;}
.bank-detail-row b { display:none;}
.bank-detail-row strong { margin-top:5px;}}

/* Cards */
.card-payment-box h4 { margin: 5px 0 10px; color: #333; font-size: 21px;}
.card-payment-box p { color: #666; line-height: 1.5;font-size:14px;}
.card-payment-box small {display: block; margin-top: 22px;  color: #777;font-size:14px;}
#razorpayPaymentForm { margin: 12px auto 0;}

/* Payment Instructions */
.payment-warning { margin: 8px 0 10px; padding: 10px; border-left: 4px solid #f3268c; background: #fff3f9; color: #333; font-size: 13px; line-height: 1.4; text-align: left;}

/* Whatsapp Button*/
.payment-whatsapp { display: inline-block; padding: 10px 17px;	font-size:16px;  border-radius: 6px; background: #25d366;  color: #fff; text-decoration: none;}
.payment-whatsapp:hover, .payment-whatsapp:focus { outline: none;  background: #1eaa52; color: #fff; text-decoration: none;}
@media (max-width: 520px) {.payment-popup { padding: 8px;}
.payment-popup-box { max-height: calc(100vh - 16px); padding: 16px 10px; border-radius: 12px;}
.payment-popup-box h3 {font-size: 22px;}
.payment-tab {flex-direction: column;  gap: 2px;  min-height: 52px;  font-size: 11px;}
.payment-panel { min-height: 205px;}
.payment-qr {width: 225px;}
.upi-main-icon,.card-main-icon {font-size: 60px;}
.bank-detail-row {grid-template-columns: 105px 8px 1fr;font-size: 13px;}}
@media (max-width: 480px) {.workshop-actions { gap: 9px;}
.workshop-action-btn {flex-basis: 42px; width: 42px; height: 42px; font-size: 18px;}}