/* -----------------------------------------------
------------------- VARIABLES --------------------
----------------------------------------------- */

/*  Colors  */

:root {
  --cw-button-main-border-color: #ddd;
  --cw-button-main-border-error-color: #e25858;
  --cw-button-main-background-color: #efefef;
  --cw-button-main-deactivated-border-color: #ddd;
  --cw-button-main-deactivated-background-color: rgb(225, 225, 225);
  --cw-button-main-deactivated-color: #acacac;
}

/* -----------------------------------------------
------------------ MAIN BUTTONS ------------------
----------------------------------------------- */

/*  Class for the div surrounding `cw-button-main` 
    and `cw-button-main-deactivated`
 
    <div 
      title="Tooltip shown on hover" 
      class="cw-button-main-container"
      >
      <button class="btn cw-button-main">
        Button Text
      </button>
    </div>  */

.cw-button-main-container {
  margin-right: 10px;
}

/*  Main button used in the website  */

.cw-button-main {
  font-size: 16px;
  padding: 0px 16px 0px 16px;
  border: 1px solid var(--cw-button-main-border-color);
  background-color: var(--cw-button-main-background-color);
  margin-top: 5px;
  border-radius: 10px;
  height: 40px;
}

/*  Deactivated version of the main button used 
    in the website  */

.cw-button-main-deactivated {
  font-size: 16px;
  padding: 0px 16px 0px 16px;
  border: 1px solid var(--cw-button-main-deactivated-border-color);
  background-color: var(--cw-button-main-deactivated-background-color);
  margin-top: 5px;
  border-radius: 10px;
  height: 40px;
  cursor: pointer;
}

/* -----------------------------------------------
--------- FORMS TIPO INSCRIPCION BUTTON ----------
----------------------------------------------- */

.form-tipo-inscripcion-button {
  width: 50%;
  margin-bottom: 16px;
  padding: 7px;
}

/* -----------------------------------------------
------------ INVITAR A PLANES BUTTON -------------
----------------------------------------------- */

.invite-btn {
  padding: 7px;
  padding-right: 12px;
  padding-left: 12px;
  margin-left: 5px;
  margin-right: 5px;
}

/* -----------------------------------------------
--------------- DASHBOARD BUTTONS ----------------
----------------------------------------------- */

.dashboard-sidebar-button {
  color:black;
  text-decoration: none;
  cursor: pointer;
  margin: 5px;
  margin-left: 20px;
  font-size: 20px;
}

.dashboard-sidebar-button:hover {
  color:black;
  text-decoration: none;
}

.dashboard-sidebar-button-view-profile {
  color:rgb(63, 63, 63);
  background-color: #b6b6b6;
  font-size: 15px;
  text-decoration: none;
  cursor: pointer;
  height: 30px;
  margin: 10px;
  padding: 0px 10px;
  border-radius: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.dashboard-sidebar-button-view-profile:hover {
  color:rgb(82, 82, 82);
  text-decoration: none;
}