/*═════════════════════════════════════════════════════════╕
│                                                          │
│ User Collections for WooCommerce      			       │
│ css.css                                                  │
│                                                          │
╘═════════════════════════════════════════════════════════*/
:root {
--usercollections-green: #5bac4e;
--usercollections-grey: #222222;
--usercollections-font: 'Roboto';
--usercollections-font-menu: 'Roboto';
--usercollections-font-buttons: 'Roboto Condensed';
}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

/* ADMIN PAGES : Menu Navigation */
#gf-usercollections-wrapper.gf-plugin-wrapper #gf-plugin-menu li a {color:var(--usercollections-grey) !important;}
#gf-usercollections-wrapper.gf-plugin-wrapper #gf-plugin-menu li a::after {background:var(--usercollections-green);}
#gf-usercollections-wrapper.gf-plugin-wrapper #gf-plugin-menu li.active a {color:var(--usercollections-green);}
#gf-usercollections-wrapper.gf-plugin-wrapper #gf-plugin-menu li.active a::after {background-color:var(--usercollections-green);}
#gf-usercollections-wrapper.gf-plugin-wrapper #gf-plugin-menu li a:hover {color:var(--usercollections-green) !important;}
#gf-usercollections-wrapper.gf-plugin-wrapper #gf-plugin-menu li a:hover::after {background-color:var(--usercollections-green);}

/* GLOBAL : Buttons */
#gf-usercollections-wrapper.gf-plugin-wrapper .gf-plugin-button {background:var(--usercollections-green);color:#fff !important;}
#gf-usercollections-wrapper.gf-plugin-wrapper .gf-plugin-button.alternate {background:var(--usercollections-grey);}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

#gf-usercollections-ajax {margin:0 -20px;}
#gf-usercollections-ajax .clearfix::after {content:'';display:block;width:auto;clear:both;}
#gf-usercollections-ajax .line_item-image {width:50px;}
#gf-usercollections-ajax .line_item-image img {width:50px;display:block;}
#gf-usercollections-ajax .wc-item-meta-label:before {display:block;content:""}
#gf-usercollections-ajax .lineitemmeta {display:block;}
#gf-usercollections-ajax .lineitemmeta p {display:inline-block;padding:0;margin:0;}
#gf-usercollections-ajax table {width:100%;}
#gf-usercollections-ajax th {width:70px}
#gf-usercollections-ajax th, 
#gf-usercollections-ajax td {padding:1em}
#gf-usercollections-ajax table, 
#gf-usercollections-ajax tr, 
#gf-usercollections-ajax th, 
#gf-usercollections-ajax td {border:1px solid #eee;border-collapse:collapse;}
#gf-usercollections-ajax tr {background:#fff;border-top:4px solid #eee}
#gf-usercollections-ajax img.size-shop_catalog {max-width:50px;display:block;}
#gf-usercollections-ajax ul.customers li {position:relative;cursor:pointer;display:block;border-bottom:1px dotted #ddd;padding:5px 20px;transition:.3s ease;margin:0;}
#gf-usercollections-ajax ul.customers li:after {position:absolute;top:0;left:0;height:100%;width:0;transition:0s;background:rgba(0,0,0,0.5);}
#gf-usercollections-ajax ul.customers li:hover {background:rgba(0,0,0,0.05);transition:.3s ease;}
#gf-usercollections-ajax ul.customers li:active {background:var(--usercollections-green);color:#fff;transition:0s ease;}
#gf-usercollections-ajax ul.customers li:active:after {width:100%;transition:1s ease;}
#gf-usercollections-ajax ul.customers li.selected {background:var(--usercollections-green);color:#fff;transition:.3s ease;}
#gf-usercollections-ajax ul.customers li span.customer-name {display:block;}
#gf-usercollections-ajax ul.customers li span.customer-email {display:block;font-size:.75em;}
#gf-usercollections-ajax footer {display:none}

#gf-usercollections-ajax #gf-column-left {height:calc(100vh - 110px);border-top:1px solid #eee;position:relative;left:0;top:0px;width:250px;background:#fff;color:#111;overflow-y:scroll;float:left;scrollbar-width:thin;}
#gf-usercollections-ajax #gf-column-left h2 {padding:0 20px;color:#111;}
#gf-usercollections-ajax #gf-column-right {margin-left:260px;height:calc(100vh - 110px);position:relative;}

#gf-usercollections-ajax #ajax-content a {color:#111;}
#gf-usercollections-ajax #ajax-content-loading, 
#gf-usercollections-ajax #ajax-content {overflow-x:hidden;overflow-y:scroll;scrollbar-width:thin;position:absolute;z-index:2;opacity:1;left:0px;display:block;width:100%;height:100%;background:none;color:#111;}
#gf-usercollections-ajax #ajax-content {z-index:0;}
#gf-usercollections-ajax #ajax-content-loading span.gf_icon_center, 
#gf-usercollections-ajax #ajax-content span.gf_icon_center {transform:translateX(-50%) translateY(-50%);-webkt-transform:translateX(-50%) translateY(-50%) !Important;top:50%;left:50%;text-align:center;display:block;position:relative;}
#gf-usercollections-ajax #ajax-content-loading span.gf_icon_center svg, 
#gf-usercollections-ajax #ajax-content span.gf_icon_center svg,
#gf-usercollections-ajax #ajax-content-loading span.gf_icon_center img, 
#gf-usercollections-ajax #ajax-content span.gf_icon_center img {width:50px;height:50px;display:block;margin:0px auto;}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media only screen and (max-width : 782px) {

#gf-usercollections-ajax {margin:0px -10px;}
#gf-usercollections-ajax #gf-column-left {float:none;width:auto;height:200px;overflow-y:scroll;}
#gf-usercollections-ajax #gf-column-right {float:none;width:auto;height:auto;min-height:50vh;max-height:none;margin:0;}
#gf-usercollections-ajax #ajax-content {height:auto;overflow-y:hidden;position:relative;}
#gf-usercollections-ajax #ajax-content span.gf_icon_center, 
#gf-usercollections-ajax #ajax-content-loading span.gf_icon_center {transform:none;top:0;left:0;margin:3rem auto;}

}
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/